目的別 CSSリファレンス (アルファベット順)

HTML4.01には各要素別に様々な属性が用意されていますが、その中でも実用的なものについての書き方と例文を目的別にまとめ、アルファベット順に並べています。

目的の書き方や例文を逆引きしたい方向けです。

PageTop

目次

記号 / B / C / D / E / F / H / I / L / M / O / P / Q / R / S / T / V / W / Z / 日本語

■ 記号
  1. #ID名 { スタイル }
  2. * { スタイル }
  3. .クラス名 { スタイル }
  4. <LINK rel="stylesheet" href="URL" type="text/css">
  5. <STYLE TYPE="text/css"> 〜 </STYLE>
  6. <要素名 style="スタイル">
  7. <要素名 style="スタイル; スタイル; …">
■ B
  1. background:背景のプロパティ
  2. background-attachment:固定の有無
  3. background-color:色指定
  4. background-image:url(URL)
  5. background-position:表示位置
  6. background-repeat:並び方
  7. border:枠線のプロパティ
  8. border-bottom:枠線のプロパティ
  9. border-bottom-color:色指定
  10. border-bottom-style:形式
  11. border-bottom-width:太さ
  12. border-collapse:枠線の表示形式
  13. border-color:色指定
  14. border-left:枠線のプロパティ
  15. border-left-color:色指定
  16. border-left-style:形式
  17. border-left-width:太さ
  18. border-right:枠線のプロパティ
  19. border-right-color:色指定
  20. border-right-style:形式
  21. border-right-width:太さ
  22. border-spacing:間隔
  23. border-spacing:間隔1 間隔2
  24. border-style:形式
  25. border-top:枠線のプロパティ
  26. border-top-color:色指定
  27. border-top-style:形式
  28. border-top-width:太さ
  29. border-width:太さ
  30. bottom:距離
  31. bottom:距離
  32. bottom:距離
■ C
  1. caption-side:タイトルの位置
  2. clear:位置
  3. color:色指定
  4. cursor:url(URL)
  5. cursor:形状
■ D
  1. direction:方向
  2. display:none
■ E
  1. empty-cells:枠線表示の有無
■ F
  1. filter:Fliph(属性)
  2. filter:Flipv(属性)
  3. filter:Gray(属性)
  4. filter:Invert(属性)
  5. filter:progid:DXImageTransform.Microsoft.Alpha(属性)
  6. filter:progid:DXImageTransform.Microsoft.BasicImage(属性)
  7. filter:progid:DXImageTransform.Microsoft.Blur(属性)
  8. filter:progid:DXImageTransform.Microsoft.Chroma(属性)
  9. filter:progid:DXImageTransform.Microsoft.DropShadow(属性)
  10. filter:progid:DXImageTransform.Microsoft.Emboss(属性)
  11. filter:progid:DXImageTransform.Microsoft.Engrave(属性)
  12. filter:progid:DXImageTransform.Microsoft.Glow(属性)
  13. filter:progid:DXImageTransform.Microsoft.Gradient(属性)
  14. filter:progid:DXImageTransform.Microsoft.MaskFilter(属性)
  15. filter:progid:DXImageTransform.Microsoft.MotionBlur(属性)
  16. filter:progid:DXImageTransform.Microsoft.Pixelate(属性)
  17. filter:progid:DXImageTransform.Microsoft.Shadow(属性)
  18. filter:progid:DXImageTransform.Microsoft.Wave(属性)
  19. filter:Xray(属性)
  20. float:位置
  21. font:フォントのプロパティ
  22. font-family:フォント名, フォント名, フォント名, …
  23. font-family:フォント名, フォント名, フォント名, …
  24. font-size:サイズ
  25. font-style:斜体
  26. font-variant:大きさ
  27. font-weight:太さ
■ H
  1. height:高さ
■ I
  1. ime-mode:形式
■ L
  1. layout-flow:表示方法
  2. layout-grid:文字間隔や行間隔のプロパティ
  3. layout-grid-char:文字間隔
  4. layout-grid-line:行間隔
  5. layout-grid-mode:設定の有無
  6. layout-grid-mode:設定の有無
  7. layout-grid-type:配置方法
  8. left:距離
  9. left:距離
  10. left:距離
  11. letter-spacing:文字間隔
  12. line-break:禁則処理
  13. line-height:行間隔
  14. list-style:リストのプロパティ
  15. list-style-image:url(URL)
  16. list-style-position:表示位置
  17. list-style-type:マークの種類
■ M
  1. margin:auto
  2. margin:マージン
  3. margin:上下マージン auto
  4. margin:上マージン auto 下マージン
  5. margin-bottom:マージン
  6. margin-left:auto;　margin-right:auto
  7. margin-left:マージン
  8. margin-right:マージン
  9. margin-top:マージン
■ O
  1. overflow:表示形式
■ P
  1. padding:パディング
  2. padding-bottom:パディング
  3. padding-left:パディング
  4. padding-right:パディング
  5. padding-top:パディング
  6. page-break-after:改ページ方法
  7. page-break-before:改ページ方法
  8. position:absolute
  9. position:fixed
  10. position:relative
■ Q
  1. Q { quotes:"記号1" "記号2" }
  2. Q:after { content:close-quote }
  3. Q:before { content:open-quote }
■ R
  1. right:距離
  2. right:距離
  3. right:距離
■ S
  1. scrollbar
■ T
  1. table-layout:表示方法
  2. text-align:行揃え位置
  3. text-decoration:装飾
  4. text-indent:インデント
  5. text-justify:均等割付
  6. text-transform:大文字・小文字の指定
  7. top:距離
  8. top:距離
  9. top:距離
■ V
  1. vertical-align:垂直位置
  2. visibility:hidden
■ W
  1. white-space:表示指定
  2. white-space:nowrap
  3. width:幅
  4. word-spacing:単語間隔
  5. writing-mode:表示方法
■ Z
  1. z-index:重なる順序
■ 日本語
  1. 要素名 { スタイル }
  2. 要素名 要素名 { スタイル }
  3. 要素名#ID名 { スタイル }
  4. 要素名,要素名,… { スタイル }
  5. 要素名.クラス名 { スタイル }
  6. 要素名:active { スタイル }
  7. 要素名:after { content:"テキスト" }
  8. 要素名:after { content:url(URL) }
  9. 要素名:before { content:"テキスト" }
  10. 要素名:before { content:url(URL) }
  11. 要素名:first-letter { スタイル }
  12. 要素名:first-line { スタイル }
  13. 要素名:hover { スタイル }
  14. 要素名:link { スタイル }
  15. 要素名:visited { スタイル }
PageTop

関連ページ

PageTop

リファレンスの構成

リファレンスの構成

このリファレンスは、

  • CSS2 (最新版はCSS2.1です)
  • Internet Explorerの独自機能
  • Netscapeの独自機能

の中で、実用的と思われるものをまとめています。しかし、仕様書に記述があるにも拘らず実装できていないものも一部含まれています。将来的に仕様書どおりに実装されるかもしれないと思い、解説は一応してあります。

対応ブラウザについては、私が全てのブラウザの種類とバージョンで動作確認をすることは出来ませんし、対応状況は日々変化するため記述をしていません。

Internet Explorerの対応状況については、HTML and CSS Technical Articlesなどを参考にしてください。

Internet Explorer : CSS Compatibility and Internet Explorer(2008.03.14現在)

Mozilla : Mozilla CSS support chart(2009.06.03現在)

Safari : Introduction to Safari CSS Reference(2009.06.08現在)

Opera : Opera でサポートされるウェブ仕様

このリファレンスでは、わかりやすくするために要素を大文字で記述していますが、実際の記述には大文字・小文字の区別はありません。

PageTop
お気に入りに追加
目的別 CSSリファレンス(アルファベット順)
目次 1. 記号 2. B 3. C 4. D 5. E 6. F 7. H 8. I 9. L 10. M 11. O 12. P 13. Q 14. R 15. S 16. T 17. V 18. W 19. Z 20. 日本語 関連ページ リファレンスの構成
スポンサードリンク