今日のカスタマイズ:2011-05-04
もう、最低限やっておいた方が良いと思うカスタマイズはすでにすんでいるけど、
全体的なレイアウトのやりかたを変えたのと、ところどころ配置や余白を調整した。
細かい部分は、随時調整するけど当面は全体の幅(『#frame』)を960pxで固定することにした。
現状では、大体960px~980pxが一般的になっているようで、
960pxだと計算がしやすいとの理由をあげている方が多いのでこのように変えた。
見た目的にはほとんど同じだけど将来的に見た目上も幅を広げるにもこの方がよいかなと・・・
960pxのグリッドを基準にサイトレイアウトをする考え方があって、
それに忠実にすると本来は、余白10pxを両端にもうけるみたいだけど・・・
見た目では、現状の背景の関係でわからないけど、一応『#subFrame』を余白左右に10pxにしておいた。
全体的なレイアウトのやりかたを変えたのと、ところどころ配置や余白を調整した。
細かい部分は、随時調整するけど当面は全体の幅(『#frame』)を960pxで固定することにした。
現状では、大体960px~980pxが一般的になっているようで、
960pxだと計算がしやすいとの理由をあげている方が多いのでこのように変えた。
見た目的にはほとんど同じだけど将来的に見た目上も幅を広げるにもこの方がよいかなと・・・
960pxのグリッドを基準にサイトレイアウトをする考え方があって、
それに忠実にすると本来は、余白10pxを両端にもうけるみたいだけど・・・
見た目では、現状の背景の関係でわからないけど、一応『#subFrame』を余白左右に10pxにしておいた。
参考リンク
displayプロパティ:プロパティの意味と使い方
- CSSの簡単な説明(CSSの基本を最初にお読みいただく方が良いかと思います。)
- 要素が生成するボックスの表示形式を設定します。
- displayプロパティに指定する値には『inline』(これが初期値でインライン要素としてインラインボックスを生成して表示),『block』(ブロックレベル要素としてブロックボックスを生成して表示),『inline-block』(ブロックボックスを生成するがインライン要素の様に改行せずに表示される),『none』(ボックスをまったく生成せず当該要素は無い状態で前後が詰まって表示される)などのキーワードを指定します。
※良く使う値は上記のものだと思いますが、他にも『table』,『table-row-group』,『table-column』,『table-column-group』,『table-header-group』,『table-footer-group』,『table-row』,『table-cell』,『table-caption』といったテーブル関連や
『list-item』(リスト項目を示すli要素として振舞う),『run-in』(後続するブロックレベル要素に取り込まれてインライン要素のような表示をする)といったキーワードも指定できます。 - 値の継承はしません。
参考リンク
はじめての方はこちらからどうぞ
z-indexプロパティ:プロパティの意味と使い方
- CSSの簡単な説明(CSSの基本を最初にお読みいただく方が良いかと思います。)
- ボックスの重ね合わせの順序を設定します。
- z-indexプロパティに指定する値には整数値か『auto』(これが初期値で親要素と同じ階層に設定されます。)といったキーワードを指定します。
- 通常の状態が0で基準となり値が大きいものが上に重なって表示されます。
- 負の値も指定できます。
- z-indexプロパティはpositionプロパティで『static』以外が指定された要素に適用されます。
- 値の継承はしません。