CSS– category –
-
【line-heightの使い方】行間を調整しをしていきます
【細かい余白を調整したのちに、line-heightプロパティを使って行間の調整をしていきます。】 余白の調整 前回まででセレクタの指定方法を詳しく見てきました。 詳しく... -
【セレクタの適用範囲を限定しよう】子要素の一番最初の要素にだけスタイルを適用する
【『>』を使ってセレクタの適用範囲を限定していく方法について見ていきます。】 sectionのスタイリング 前回までで要素を縦方向で中央揃えしていく方法について学ん... -
【align-itemsを使おう】要素を縦方向で中央揃えしていく方法
【Flexbox内の要素を縦方向で中央揃えにするために、align-itemsを使っていきます。】 align-items 前回まででリストを横並びにする方法について学んで来ました。 詳し... -
【リストのスタイリング】CSSでリストを横並びにする簡単な方法を徹底解説
【リストの余白を整えつつ、Flexboxで要素を横並びにしていきます。】 リストのスタイリング 前回は見出しの整え方について見てきました。 詳しくは『【見出しのスタイ... -
【見出しのスタイリングを整える】CSSで太さや大きさ、余白などを指定します。
【見出しに設定されているスタイルを確認し、CSSで上書きをしていきます。】 要素の検証 前回はアイコンのスタイリング方法について見てきました。 詳しくは『【アイコ... -
【アイコン画像のスタイリングをしよう】角を取り丸める方法について
【半角空白を使ってセレクタの適用範囲を限定し、領域の角を丸めるためのborder-radiusプロパティと、枠に関するプロパティについて見ていきます。】 半角空白区切りの... -
【Flexboxを使う】CSSで要素を横並びにする方法と親要素と子要素の関係について
【header内の要素を横並びにするために、Flexboxを使う方法を見ていきます。】 親要素と子要素 前回は領域を指定する方法について見てきました。 詳しくは『【divタグを... -
【divタグを使う】領域を指定してデザインをより自由にする
【レイアウトのために使えるdivタグを使いながらスタイリングを進めていきます。】 div 前回までで余白の設定方法について学んで来ました。 詳しくは『【marginで外側の... -
【marginで外側の余白を設定】余白の設定方法について
【marginプロパティを使ってheader領域の余白を設定していきます。】 marginの設定 前回まででCSSのボックスモデルについて見てきました。 詳しくは『【CSSのボックスモ... -
【CSSのボックスモデルを確認しよう】デベロッパーツールを見ながらヘッダー領域のスタイリング
【ボックスモデルを確認しながらheader領域のスタイリングを進めていきます。】 background-color 前回はフォントの設定について見てきました。 詳しくは『【フォントを...