Windows Internet Explorer の新しいリリースが発表されるたびに、カスケード スタイル シート (CSS) 標準のサポートは絶えず改善されてきました。 Internet Explorer 6 は、CSS レベル 1 に完全準拠した最初の Internet Explorer バージョンでした。 Windows Internet Explorer 8 は、CSS レベル 2 リビジョン 1 (CSS 2.1) の仕様に完全準拠し、CSS レベル 3 (CSS 3) の一部の機能をサポートします。

お客様の Web サイトが、以前のバージョンの Internet Explorer を含むブラウザーを対象にする場合、各バージョンの CSS 準拠レベルを確認する必要があります。 この記事では、Internet Explorer 8 でのサポート状況を含む、Internet Explorer の最近の各バージョンにおける CSS 準拠の状況を簡単に説明します。

注 : Internet Explorer 8 で新しく搭載された CSS 機能は、IE8 モード (またはそれ以上) でページが表示される場合にのみ機能します。 ページの head セクションに次のメタ タグを指定すると、ページを IE8 モードで表示できます。

<meta http-equiv="X-UA-Compatible" content="IE=8" />

ドキュメント互換モードの詳細については、「ドキュメント互換性の定義」 (英語の可能性あり) を参照してください。

この記事の構造は、MSDN の「CSS 参照ドキュメント」の構造にほぼ基づいています。 この記事は、次の各セクションで構成されます。

  • 概要
  • @ ルール
  • セレクター
    • 要素セレクター
    • 属性セレクター
    • 連結子
    • 擬似クラス
    • 擬似要素
  • 属性
    • リスト
    • 色および背景
    • フォントおよびテキスト
    • 生成されるコンテンツ
    • 境界線およびレイアウト
    • 位置揃え
    • 印刷
    • ユーザー インターフェイス
    • 複数列レイアウト
    • スピーチ
    • メディア クエリ
    • 数値
    • 文字列
    • 図形
    • 関数
    • キーワード
  • 単位

概要

最近のバージョンの Internet Explorer における、グループ化された CSS 機能のサポート状況を各表に示します。 各セクションの最初の表は、CSS 2.1 以前に導入された機能を表します。2 番目の表は、World Wide Web コンソーシアム (W3C) で計画されている CSS 3 の機能を表します。

表中の "○" は、そのバージョンの Internet Explorer で機能が実装されていることを示します。

表中の "部分的" は、そのバージョンの Internet Explorer で機能の一部のみが実装されていることを示します。 詳細については、リンクをクリックして、MSDN サイトの各機能の参照ページをご覧ください。

表中の "×" は、そのバージョンの Internet Explorer で機能が実装されていないことを示します。

@ ルール

CSS 2.1:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
@charset ×
@import
@media ×
@page 部分的 部分的 部分的 部分的

CSS 3:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
@font-face ×
@namespace × × × × ×

セレクター

要素セレクター

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
.value { sRules } Class (注を参照) 部分的 部分的 部分的
#value { sRules } ID
E { sRules } Type
* { sRules } Universal × × ×

注 : Internet Explorer 7 より前のバージョンでは、要素ごとに 2 つのクラス セレクターの制限があります。

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
ns|E { sRules } 名前空間 × × × × ×

属性セレクター

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
[att=val] { sRules } 等値 [=] × × ×
[att] { sRules } 実在 [] × × ×
[att|=val] { sRules } ハイフン [|=] × × ×
[att~=val] { sRules } 空白 [~=] × × ×

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
[ns|attr] { sRules } 名前空間 × × ×
[att^=val] { sRules } プレフィックス [^=] × × ×
[att*=val] { sRules } サブ文字列 [*=] × × ×
[att$=val] { sRules } サフィックス [$=] × × ×

連結子

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
E+F { sRules } 隣接する兄弟 (+) × × ×
E>F { sRules } 子 (>) × × ×
EF { sRules } 子孫

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
E~F { sRules } 一般の兄弟 (~) × × ×

擬似クラス

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
:active { sRules } :active × × × 部分的
:first-child { sRules } :first-child × × ×
:focus { sRules } :focus × × × ×
:hover { sRules } :hover 部分的 部分的 部分的
:lang(C) { sRules } :lang() × × × ×
:link { sRules } :link
:visited { sRules } :visited
@page :first { sRules } @page :first × × × ×
@page :left { sRules } @page :left × × × ×
@page :right { sRules } @page :right × × × ×

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
:root { sRules } :root × × × × ×
:nth-child() { sRules } :nth-child() × × × × ×
:nth-last-child() { sRules } :nth-last-child() × × × × ×
:nth-of-type() { sRules } :nth-of-type() × × × × ×
:nth-last-of-type() { sRules } :nth-last-of-type() × × × × ×
:last-child { sRules } :last-child × × × × ×
:first-of-type { sRules } :first-of-type × × × × ×
:last-of-type { sRules } :last-of-type × × × × ×
:only-child { sRules } :only-child × × × × ×
:only-of-type { sRules } :only-of-type × × × × ×
:empty { sRules } :empty × × × × ×
:target { sRules } :target × × × × ×
:not(X) { sRules } :not() × × × × ×
:enabled { sRules } :enabled × × × × ×
:disabled { sRules } :disabled × × × × ×
:checked { sRules } :checked × × × × ×
:indeterminate { sRules } :indeterminate × × × × ×
:default { sRules } :default × × × × ×
:valid { sRules } :valid × × × × ×
:invalid { sRules } :invalid × × × × ×
:in-range { sRules } :in-range × × × × ×
:out-of-range { sRules } :out-of-range × × × × ×
:required { sRules } :required × × × × ×
:optional { sRules } :optional × × × × ×
:read-only { sRules } :read-only × × × × ×
:read-write { sRules } :read-write × × × × ×

擬似要素

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
:after { sRules } :after × × × ×
:before { sRules } :before × × × ×
:first-letter { sRules } :first-letter ×
:first-line { sRules } :first-line ×

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
::before { sRules } ::before × × × × ×
::after { sRules } ::after × × × × ×
::first-letter { sRules } ::first-letter × × × × ×
::first-line { sRules } ::first-line × × × × ×
::selection { sRules } ::selection × × × × ×
::value { sRules } ::value × × × × ×
::choices { sRules } ::choices × × × × ×
::repeat-item { sRules } ::repeat-item × × × × ×
::repeat-index { sRules } ::repeat-index × × × × ×

属性

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ sRule!important  } !important 宣言 部分的 部分的 部分的

リスト

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ list-style : sStyle } list-style
{ list-style-image : sStyle } list-style-image
{ list-style-position : sStyle } list-style-position
{ list-style-type : sStyle } list-style-type × × × 部分的

色および背景

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ color : sColor } color
{ background : sBackground } background
{ background-attachment : sAttachment } background-attachment 部分的 部分的 部分的
{ background-color : sColor } background-color
{ background-image : sLocation } background-image
{ background-position : sPosition } background-position 部分的 部分的 部分的 部分的
{ background-repeat : sRepeat } background-repeat

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ color-profile : sProfile } color-profile × × × × ×
{ rendering-intent : sIntent } rendering-intent × × × × ×
{ background : sBackground1,
sBackground2, etc. }
background (複数) × × × × ×
{ background-clip : sClip } background-clip × × × × ×
{ background-origin : sOrigin } background-origin × × × × ×
{ background-break : sBreak } background-break × × × × ×
{ background-size : sSize } background-size × × × × ×

フォントおよびテキスト

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ direction : sDirection } direction
{ font : sFont } font
{ font-family : sFamily } font-family
{ font-size : sSize } font-size
{ font-style : sStyle } font-style
{ font-variant : sVariant } font-variant
{ font-weight : sWeight } font-weight 部分的 部分的 部分的 部分的
 { letter-spacing : sSpacing } letter-spacing
 { line-height : sHeight } line-height
{ text-align : sAlign } text-align
{ text-decoration : sDecoration } text-decoration
{ text-indent : sIndent } text-indent
{ text-transform : sTransform } text-transform
{ unicode-bidi : sAlign } unicode-bidi
{ vertical-align : sAlign } vertical-align
{ white-space : sWrap } white-space 部分的 部分的 部分的 部分的
{ word-spacing : sSpacing } word-spacing 部分的 部分的 部分的 部分的

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ font-effect : sEffect } font-effect × × × × ×
{ font-emphasize : sEmphasize } font-emphasize × × × × ×
{ font-size-adjust : sSizeAdjust } font-size-adjust × × × × ×
{ font-smooth : sSmooth } font-smooth × × × × ×
{ font-stretch : sStretch } font-stretch × × × × ×
{ hanging-punctuation : sHangingPunctuation } hanging-punctuation × × × × ×
{ punctuation-trim : sTrim } punctuation-trim × × × × ×
{ ruby-align : sRubyAlign } ruby-align
{ ruby-overhang : sRubyOverhang } ruby-overhang
{ ruby-position : sRubyPlacement } ruby-position
{ ruby-span : sRubySpan } ruby-span × × × × ×
{ text-align-last : sAlignLast } text-align-last 部分的 部分的 部分的 部分的 部分的
{ text-emphasis : sEmphasis } text-emphasis × × × × ×
{ text-justify : sJustify } text-justify ×
{ text-outline : sOutline } text-outline × × × × ×
{ text-overflow : sOverflow} text-overflow × 部分的 部分的 部分的 部分的
{ text-shadow : sShadow } text-shadow × × × × ×
{ text-wrap : sWrap } text-wrap × × × × ×
{ word-break : sBreak } word-break 部分的 部分的 部分的 部分的 部分的
{ word-wrap : sWrap } word-wrap
{ writing-mode : sFlow } writing-mode

生成されるコンテンツ

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ content : sContent } content × × × ×
{ counter-increment : sCounter } counter-increment × × × ×
{ counter-reset : sCounter } counter-reset × × × ×
{ quotes : sQuotes } quotes × × × ×

境界線およびレイアウト

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ border : sBorder } border
{ border-bottom : sBottom } border-bottom ×
{ border-bottom-color : sColor } border-bottom-color
{ border-bottom-style : sStyle } border-bottom-style ×
{ border-bottom-width : sWidth } border-bottom-width ×
{ border-collapse : sCollapse } border-collapse 部分的 部分的 部分的 部分的
{ border-color : sColor } border-color
{ border-left : sLeft } border-left ×
{ border-left-color : sColor } border-left-color
{ border-left-style : sStyle } border-left-style ×
{ border-left-width : sWidth } border-left-width ×
{ border-right : sRight} border-right ×
{ border-right-color : sColor } border-right-color
{ border-right-style : sStyle } border-right-style ×
{ border-right-width : sWidth } border-right-width ×
{ border-spacing : sSpacing } border-spacing × × × ×
{ border-style : sStyle } border-style × 部分的 部分的 部分的
{ border-top : sTop } border-top ×
{ border-top-color : sColor } border-top-color
{ border-top-style : sStyle } border-top-style ×
{ border-top-width : sWidth } border-top-width ×
{ border-width : sWidth } border-width
{ caption-side : sLocation } caption-side × × × ×
{ clear : sClear } clear
{ empty-cells : sEmptyCells } empty-cells × × × 部分的
{ float : sFloat } float
{ margin : sMargin } margin
{ margin-bottom : sHeight } margin-bottom
{ margin-left : sWidth } margin-left
{ margin-right : sWidth } margin-right
{ margin-top : sHeight } margin-top
{ padding : sPadding } padding
{ padding-bottom : sPadding } padding-bottom
{ padding-left : sPadding } padding-left
{ padding-right : sPadding } padding-right
{ padding-top : sPadding } padding-top
{ table-layout : sLayout } table-layout

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ border-break : sBreak } border-break × × × × ×
{ border-image : sImage } border-image × × × × ×
{ border-radius : sRadius } border-radius × × × × ×
{ box-shadow : sShadow } box-shadow × × × × ×

位置揃え

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ bottom : sBottom } bottom × 部分的 部分的 部分的
{ clip : sClip } clip ×
{ display : sDisplay } display 部分的 部分的 部分的 部分的
{ height : sHeight } height
{ left : sPosition } left × 部分的 部分的 部分的
{ max-height : sMaxHeight } max-height × × ×
{ max-width : sWidth } max-width × × ×
{ min-height : sMinHeight } min-height × × ×
{ min-width : sMinWidth } min-width × × ×
{ overflow : sOverflow } overflow 部分的 部分的 部分的
{ position : sPosition } position 部分的 部分的 部分的
{ right : sPosition } right × 部分的 部分的 部分的
{ top : sTop } top × 部分的 部分的 部分的
{ visibility : sVisibility } visibility
{ width : sWidth } width
{ z-index : vOrder } z-index 部分的 部分的 部分的 部分的

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ overflow-x : sOverflow } overflow-x 部分的 部分的 部分的
{ overflow-y : sOverflow } overflow-y 部分的 部分的 部分的

印刷

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ orphans : nLines } orphans × × × ×
{ page-break-after : sBreak } page-break-after
{ page-break-before : sBreak } page-break-before
{ page-break-inside : sBreak } page-break-inside × × × ×
{ widows : nLines } widows × × × ×

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ fit : sFit } fit × × × × ×
{ fit-position : sPosition } fit-position × × × × ×
{ image-orientation : sOrientation } image-orientation × × × × ×
{ page : sPage } page × × × × ×
{ size : sSize } size × × × × ×

ユーザー インターフェイス

CSS 2.1:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ cursor : sCursor } cursor ×
{ outline : sOutline } outline × × × ×
{ outline-color : sColor } outline-color × × × ×
{ outline-style : sStyle } outline-style × × × ×
{ outline-width : sWidth } outline-width × × × ×

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ appearance : sAppearance } appearance × × × × ×
{ box-sizing : sSizing } box-sizing × × × ×
{ icon : sIcon } icon × × × × ×
{ nav-down : sNavDown } nav-down × × × × ×
{ nav-index : sIndex } nav-index × × × × ×
{ nav-left : sNavLeft } nav-left × × × × ×
{ nav-right : sNavRight } nav-right × × × × ×
{ nav-up : sNavUp } nav-up × × × × ×
{ outline-offset : sOffset } outline-offset × × × × ×
{ outline-radius : sRadius } outline-radius × × × × ×
{ resize : sResize } resize × × × × ×

複数列レイアウト

CSS 3:

    Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
{ column-break-after : sSize } column-break-after × × × × ×
{ column-break-before : sSize } column-break-before × × × × ×
{ column-break-inside : sSize } column-break-inside × × × × ×
{ column-count : sCount } column-count × × × × ×
{ column-gap : sSize } column-gap × × × × ×
{ column-rule : sRule } column-rule × × × × ×
{ columns : sColumns } columns × × × × ×

スピーチ

次の CSS 3 スピーチ属性は Internet Explorer ではサポートされません。

  • voice-volume
  • voice-balance
  • speak
  • pause
  • pause-after
  • pause-before
  • rest
  • rest-before
  • rest-after
  • cue
  • cue-after
  • cue-before
  • mark
  • mark-before
  • mark-after
  • voice-family
  • voice-rate
  • voice-pitch
  • voice-pitch-range
  • voice-stress
  • voice-duration
  • phonemes

メディア クエリ

次の CSS 3 メディア クエリ属性は Internet Explorer ではサポートされません。

  • width
  • height
  • device-width
  • device-height
  • device-aspect-ratio
  • color
  • color-index
  • monochrome
  • resolution
  • scan
  • grid

数値

CSS 2.1:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
<number>
<length>
<percentage>
<integer>

CSS 3:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
<angle> × × × × ×
<time> × × × × ×
<frequency> × × × × ×

文字列

CSS 2.1:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
<string >
\code × ×

図形

CSS 2.1:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
rect() ×

関数

CSS 2.1:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
url()
counter() × × × ×
attr() × × × ×

CSS 3:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
calc() × × × × ×

CSS 2.1:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
<color> (names)
<color> (#rrggbbor#rgb 表記)
<color> (rgb(r,g,b) 表記)
<color> (システム カラー)
transparent × × 部分的

CSS 3:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
<color> (rgba(r,g,b,a) 表記) × × × × ×
<color> (hsl(h,s,l) 表記) × × × × ×
<color> (hsla(h,s,l,a) 表記) × × × × ×

キーワード

CSS 2.1:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
auto × × 部分的
inherit × × × ×

CSS 3:

  Internet Explorer 5 Internet Explorer 5.5 Internet Explorer 6 Internet Explorer 7 Internet Explorer 8
initial × × × × ×

単位

次のすべての単位は Internet Explorer 3.0 以降でサポートされます。

  • px
  • pt
  • pc
  • cm
  • mm
  • in
  • em
  • ex
  • %

次の CSS 3 単位は Internet Explorer ではサポートされません。

  • deg
  • grad
  • rad
  • ms
  • s
  • Hz
  • kHz
  • turn
  • gd
  • rem
  • vw
  • vh
  • vm
  • ch

関連項目