その他 > CSSとHTMLのメモ >　知っていると便利かも

マージンとパディング
- ボックスなどのボーダー（枠線）の外側の余白がマージン、枠線の内側の余白がパディング。
- 数値を1つ記述すると上下左右4方向全部同じ指定、数値を2つ記述すると上下/左右、3つ記述で上/左右/下、4つは上右下左の指定になる。
  　margin : 0;　　　/* 4方向のマージンは全部0ピクセルに指定 */
  　margin : 10px 5px 0px 5px;　　/* 上10ピクセル、左右5ピクセル、下0ピクセルにマージンを指定 */
  　padding : 20px 10px;　　/* 上下のパディングを20ピクセル、左右のパディングを10ピクセルに指定 */
- 4方向個別に指定することもできる。
  　margin-top:
  　margin-bottom:
  　margin-left:
  　margin-right:
  　padding-top:
  　padding-bottom:
  　padding-left:
  　padding-right:
◆Firefoxだと、パディングを指定して枠線を指定すると、少し隙間が空くようだ。
リストマークを指定する
- list-style-typeとして、以下のように記述する。
  　list-style-type: disc;　　/* 塗りつぶされた● */
  　list-style-type: circle;　　/* 塗りつぶされない○ */
  　list-style-type: square;　　/* 四角■ */
  　list-style-type: decimal;　/* 数字 */
  　list-style-type: decimal-leading-zero;　/* 0付き数字 */
  　list-style-type: none;　　/* リストマークを表示しない */
  　list-style-image: url(xxx.gif);　　/* リストマークとして画像を表示 */
◆<ul class="">で指定すると、それ以下の全部がその設定になる。下の階層があっても無視されるみたいだ。そのときは<li class="">で、項目に対して指定すればいいみたいだな。
テーブルの枠線を左右だけ表示する
- 以下のように線の太さを0と記述すればできる。　
  /* CSS定義 */
  .test1{
  border-width: 0px 1px;　　 /* 線の幅　2つの指定は、上下と左右 */
  border-style: solid;　　　　 /* 線のスタイル（実線） */
  border-color: blue;　　　　　/* 線の色 */
  }
  
  /* HTML記述 */
  …
  <TABLE border="0" cellspacing="0" cellpadding="0">
  <TBODY>
  <TR>
  　<TD class="test1">
  　　…
  　</TD>
  　…
　
IE6で写真に表示される「イメージツールバー」を表示しない
- <HEAD>と</HEAD>の間にMETAタグで以下を指定する。
  <META http-equiv="imagetoolbar" content="no">
◆結構邪魔くさいよな。IE自体のオプションで設定できるけどね。

▲ページのトップ