メディアクエリを使ってWebサイト内の文章の改行をコントロールする方法
CSSのメディアクエリを使って、デバイスのディスプレイ幅に応じて文章の改行をコントロールする方法について説明します。 HTMLのbrタグを使う方法と、CSSの擬似要素を使う方法の二つを紹介します。
:has()擬似クラスを使いこなす！CSSだけで実現する新しいインタラクティブ表現とレイアウト術
CSSの強力な新機能「:has()」擬似クラスを徹底解説！JavaScriptなしでインタラクティブなUIや柔軟なレイアウトを実現し、Webサイトの表現力を劇的に向上させるモダンCSSの最前線を学びましょう。具体的なコード例と応用テクニックで、あなたのWeb開発を加速させます。
サムネイルに連動する画像表示をSwiperで作る
Swiperは、多機能なスライダーをサイトに設置することができるJavaScriptライブラリです。 Swiperを利用することで、サムネイルと拡大画像が連動して表示されるようなよく使われる画像表示を簡単に作成することができます。今回は、そのような画像表示をSwiperを使って作成する方法について紹介します。
紙芝居のようにスクロールできる”StickyStack.js”の使い方
jQueryのプラグイン「StickyStack.js」の使い方を紹介します。スクロールした時にスタッキング要素が固定されて表示されるので、下からスクロールアップしてくる要素が上に重なっていくような視覚効果を実現することができます。
CSSのposition: sticky;を徹底解説！スクロールで要素を固定・追従させる魔法の指定
CSSのposition: sticky;プロパティの基本的な使い方から、ヘッダーやサイドバーをスクロール追従させる具体的な使用例まで、初心者にも分かりやすく解説します。stickyが効かない時の対処法も紹介。
CSSでレスポンシブなtableをつくる
tableのレイアウトをパソコンでの表示とスマートフォンでの表示とで切り替えたい時など、ディスプレイの幅が違う時でもtableのレイアウトをCSSで適切に表示させたい時の方法を紹介します。
WordPressの投稿一覧表示の順番を更新日順にする方法
WordPressの投稿の表示はデフォルトで公開日が新しい順に表示されるようになっています。今回はWordPressの投稿の表示順を更新日が新しい順に表示されるように変更する法を紹介します。
WordPressで固定ページに投稿一覧を作成する方法：完全ガイドとカスタマイズ術
WordPressで固定ページに投稿一覧をカスタマイズして表示する方法を解説。WP_Queryを使った全投稿表示、ページネーション、表示件数変更、アイキャッチやカテゴリー表示のカスタマイズまで、SEOに配慮した完全ガイド。
斜めの背景をCSSで作る方法
Webサイトのセクションの区切り等で背景色の切り替わりが斜めになっているようなデザインがありますが、 このような斜めの背景をCSSで作るにはtransformやclip-pathを利用する方法が考えられます。 今回は、これら二つを使って斜めの背景を作る方法を具体的な記述例と併せて紹介していきたいと思います。