文書ディレクトリ

一、要素の表示と非表示

1.1 display

1.2 visibility可視性

1.3 overflowオーバーフロー

二、CSSユーザインタフェーススタイル

2.1マウススタイルcursor

2.2輪郭線outline

2.3テキストドメインresize

のドラッグアンドドロップ防止

三、vertical-align垂直整列

3.1画像と文字の位置合わせ

3.2画像の底側の空白の隙間を取り除く

四、あふれ出た文字省略符表示

五、CSS精霊技術sprite

六、スライドドア

7、拡張

7.1 margin負の値の美

7.2 CSS三角形の美

一、要素の表示と非表示

1.1 display

が非表示になった後、位置

は保持されません.

1.2 visibility可視性

が非表示になった後も、既存の位置

を保持し続ける.

1.3オーバーフロー

箱の中の内容がこの箱の範囲を超えないことを保証する

二、CSSユーザーインタフェースのスタイル

2.1マウススタイルcursor

pointer:小手

2.2アウトライン

削除none

2.3テキストフィールドのドラッグアンドドロップ防止resize

ドラッグ不可:none

三、vertical-align垂直位置合わせ

3.1画像と文字の位置合わせ

は、行内要素および行内ブロック要素

に対してのみ適用する.

画像と文字の位置合わせを制御する

3.2写真の底側の空白の隙間を取り除く

理由:画像の底面のデフォルトと親ボックスのベースラインの位置合わせ

解決策:ベースラインに整列しないかblock

に変換しない

四、オーバーフローした文字省略記号表示

  /*1.           */
      white-space: nowrap;
  /*2.        */
      overflow: hidden;
  /*3.              */
      text-overflow: ellipsis;

五、CSS精霊技術sprite

CSS精霊は、実際には、ページ内のいくつかの背景画像を大きな図(精霊図)

に統合している.

Fireworks

の使用を推奨

六、スライドドア

aラベルの中にspan

を入れます

aは左側背景、spanは右側背景

を用いる.

aがspanを含むのは、ナビゲーション全体がクリック可能な

であるからである.

七、拡張

7.1 margin負の値の美

margin=-1で、隣接する箱の枠

を押さえることができる.

位置決めレベルを調整することにより、枠線を

ハイライトすることができる.

7.2 CSS三角形の美しさ

不要な枠線、色をtransparent

に変更