ネガティブマージンとFlexboxを使用したテクニック
- Mark up
今回は業務中に使って便利だったCSSのネガティブマージンとFlexboxを使用したテクニックを紹介する記事を書きたいと思います。Flexboxで要素を並べるときに親要素の幅によって子要素を折り返すために、flex-wrap を指定します。ここで子要素同士に余白をつけるため、marginをとった場合、1行目と1列目にも不要なmarginが...
今回は業務中に使って便利だったCSSのネガティブマージンとFlexboxを使用したテクニックを紹介する記事を書きたいと思います。Flexboxで要素を並べるときに親要素の幅によって子要素を折り返すために、flex-wrap を指定します。ここで子要素同士に余白をつけるため、marginをとった場合、1行目と1列目にも不要なmarginが...
今回はWebサイトによくあるサイト内検索を a-blog cms で実装する方法について紹介します。よくあるキーワード検索だけではなく、カテゴリーや、カスタムフィールドの値でのサイト内検索の実装方法を紹介します。a-blog cms ではキーワード検索はもちろんのこと、カテゴリーやカスタムフィールドの値、日付を指定してエ...
今回は a-blog cms の developテーマの Babel 設定ファイルである .babelrc が何をしているかを記事にしていきます。この記事を最後まで読むことで Babel についての基礎的なことが理解できます。developテーマとは a-blog cms が提供しているテーマの1つです。a-blog cms でWebサイトを開発する際のテンプレートとフロ...
WebアプリやWebサイトに、何らかのアラートを表示させたいと思う場面はないでしょうか? JavaScript の標準機能である alert メソッドを利用してもよいのですが、デザインが味気なかったり、複雑なアラートが実装できなかったりといった事があるかと思います。今回は、そんな場面に活躍する SweetAlert2 という JavaScri...