W3Schools の CSS リファレンスは、主要な全ブラウザで正式にテストをしています。
"CSS"の欄は、プロパティが定義された CSS のバージョン(CSS1、CSS2、CSS3)を表します。
プロパティ | 説明 | CSS |
---|---|---|
color | テキストの色を設定します | 1 |
opacity | 要素の不透明度を設定します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
background | 1回の宣言で全ての background プロパティを設定するショーハンドプロパティ | 1 |
background-attachment | 背景イメージを固定するか、スクロールするかを設定します | 1 |
background-blend-mode | 各背景レイヤ(カラー/画像)の描画モードを指定します | 3 |
background-color | 要素の背景色を設定します | 1 |
background-image | 要素に1つ以上の背景画像を指定します | 1 |
background-position | 背景画像の位置を指定します | 1 |
background-repeat | 背景画像の繰返し方法を設定します | 1 |
background-clip | 背景の描画エリアを指定します | 3 |
background-origin | 背景画像をどこに配置するかを指定します | 3 |
background-size | 背景画像のサイズを指定します | 3 |
border | 1回の宣言で全ての border プロパティを設定します | 1 |
border-bottom | 1回の宣言で全ての下ボーダープロパティを設定します | 1 |
border-bottom-color | Sets the color of the bottom border | 1 |
border-bottom-left-radius | 左下コーナーのボーダーの形状を定義します | 3 |
border-bottom-right-radius | 右下コーナーのボーダーの形状を定義します | 3 |
border-bottom-style | 下ボーダーのスタイルを設定します | 1 |
border-bottom-width | 下ボーダーの幅を設定します | 1 |
border-color | 4辺のボーダーの色を設定します | 1 |
border-image | 全ての border-image-* プロパティを設定するためのショートハンドプロパティ | 3 |
border-image-outset | ボーダーボックスを越えて拡大するボーダー画像エリアの量を指定します | 3 |
border-image-repeat | ボーダー画像を、繰り返すか、整数回繰り返すか、引伸ばすかどうかを指定します | 3 |
border-image-slice | ボーダー画像のスライス方法を指定します | 3 |
border-image-source | ボーダーとして使用する画像へのパスを指定します | 3 |
border-image-width | 画像ボーダーの幅を指定します | 3 |
border-left | 1回の宣言で全ての左ボーダープロパティを設定します | 1 |
border-left-color | 左ボーダーの色を設定します | 1 |
border-left-style | 左ボーダーのスタイルを設定します | 1 |
border-left-width | 左ボーダーの幅を設定します | 1 |
border-radius | 全ての border-*-radius プロパティを設定するためのショートハンドプロパティ | 3 |
border-right | 1回の宣言で全ての右ボーダープロパティを設定します | 1 |
border-right-color | 右ボーダーの色を設定します | 1 |
border-right-style | 右ボーダーのスタイルを設定します | 1 |
border-right-width | 右ボーダーの幅を設定します | 1 |
border-style | 4つのボーダーのスタイルを設定しますs | 1 |
border-top | 1回の宣言で全ての上ボーダープロパティを設定します | 1 |
border-top-color | 上ボーダーの色を設定します | 1 |
border-top-left-radius | 左上コーナーのボーダーの形状を定義します | 3 |
border-top-right-radius | 右上コーナーのボーダーの形状を定義します | 3 |
border-top-style | 上ボーダーのスタイルを設定します | 1 |
border-top-width | 上ボーダーの幅を設定します | 1 |
border-width | 4つのボーダーの幅を設定しますs | 1 |
box-decoration-break | 改ページ時の要素、または改行時のインライン要素の、背景とボーダーの振る舞いを設定します | 3 |
box-shadow | ボックスに1つ以上の影を設定します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
bottom | 配置した要素の下辺の位置を指定します | 2 |
clear | 他のフローティング要素を許容しない要素のサイドを指定します | 1 |
clip | 絶対配置された要素を切り抜きます | 2 |
display | 特定の HTML 要素をどのように表示するかを指定します | 1 |
float | ボックスをフロートするかどうかを指定します | 1 |
height | 要素の高さを設定します | 1 |
left | 配置した要素の左辺の位置を指定します | 2 |
margin | 1回の宣言で全ての margin プロパティを設定します | 1 |
margin-bottom | 要素の下マージンを設定します | 1 |
margin-left | 要素の左マージンを設定します | 1 |
margin-right | 要素の右マージンを設定します | 1 |
margin-top | 要素の上マージンを設定します | 1 |
max-height | 要素の最大の高さを設定します | 2 |
max-width | 要素の最大の幅を設定します | 2 |
min-height | 要素の最小の高さを設定します | 2 |
min-width | 要素の最小の幅を設定します | 2 |
overflow |
コンテンツが要素のボックスをオーバフローした場合どうするかを指定します | 2 |
overflow-x | 要素のコンテンツエリアをオーバフローした場合、コンテンツの左/右の端をクリップするかどうかを指定します | 3 |
overflow-y | 要素のコンテンツエリアをオーバフローした場合、コンテンツの上/下の端をクリップするかどうかを指定します | 3 |
padding | 1回の宣言で全てのパディングプロパティを設定します | 1 |
padding-bottom | 要素の下パディングを設定します | 1 |
padding-left | 要素の左パディングを設定します | 1 |
padding-right | 要素の右パディングを設定します | 1 |
padding-top | 要素の上パディングを設定します | 1 |
position | 要素の配置方法のタイプを指定します(static、relative、absolute または fixed) | 2 |
right | 配置した要素の右辺の位置を指定します | 2 |
top | 配置した要素の上辺の位置を指定します | 2 |
visibility | 要素を表示するかどうかを指定します | 2 |
width | 要素の幅を設定します | 1 |
vertical-align | 要素の縦位置揃えを設定します | 1 |
z-index | 配置した要素のスタック順序を設定します | 2 |
プロパティ | 説明 | CSS |
---|---|---|
align-content | 項目が利用可能な全てのスペースを使用しない場合、フレキシブル・コンテナの内部の行間の配置を指定します | 3 |
align-items | フレキシブル・コンテナの内部の項目の配置を指定します | 3 |
align-self | フレキシブル・コンテナ内部の選択した項目の配置を指定します | 3 |
flex | 残り部分を基準に項目の長さを指定します | 3 |
flex-basis | フレキシブル項目の長さの初期値を指定します | 3 |
flex-direction | フレキシブル項目の方向を指定します | 3 |
flex-flow | flex-direction と flex-wrap プロパティのショーハンドプロパティ | 3 |
flex-grow | アイテムが残りに比べてどれくらい引伸ばすか指定します | 3 |
flex-shrink | アイテムが残りに比べてどれくらい縮小するか指定します | 3 |
flex-wrap | フレキシブル項目をラップすべきかどうかを指定します | 3 |
justify-content | 項目が利用可能なスペースを全て使用しない場合、フレキシブル・コンテナの内部のアイテム間の配置を指定します | 3 |
order | 残りの部分と相対的にフレキシブル項目の順序を設定します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
hanging-punctuation | 句読点(約物か?)を行ボックスの外側に配置できるかどうかを指定します(禁則処理) | 3 |
hyphens | 段落のレイアウトを改善するために単語を分割する方法を設定します | 3 |
letter-spacing | テキストの文字間のスペースを増分または減分します | 1 |
line-break | 禁則処理のレベルを指定します | 3 |
line-height | 行の高さを設定します | 1 |
overflow-wrap | 包含ボックスにフィットされるには文字列が長すぎる場合、オーバフローを防止するために、 単語内で改行できるかどうかをブラウザに指定します | 3 |
tab-size | タブ文字の長さを指定します | 3 |
text-align | テキストの横の配置を指定します | 1 |
text-align-last | text-align が "justify"(均等割り付け)の場合、強制改行前のブロックの最終行、 または行の右側がどのように配置されるかを記述します | 3 |
text-combine-upright | 単独の文字スペースの中へ複数文字の結合を指定します(訳注:縦書き内の横書きの字組み。縦中横ともいう) | 3 |
text-indent | テキスト・ブロックの先頭行のインデントを指定します | 1 |
text-justify | text-align が"justify"(均等割り付け)の場合、均等割り付けのメソッドを指定します | 3 |
text-transform | テキストの大文字表示・小文字表示を制御します | 1 |
white-space | 要素内の空白の取扱い方法を指定します | 1 |
word-break | 非 CJK 文字(中国語:Chinese、日本語:Japanese、韓国語:Korean)の改行ルールを指定します | 3 |
word-spacing | テキスト内の単語間のスペースを増減します | 1 |
word-wrap | 長い非改行の単語を改行して次の行に回り込むことを可能にします | 3 |
プロパティ | 説明 | CSS |
---|---|---|
text-decoration | テキストに装飾の追加を指定します | 1 |
text-decoration-color | 線の色を指定します | 3 |
text-decoration-line | 線の位置を指定します | 3 |
text-decoration-style | 線の種類を指定します | 3 |
text-shadow | テキストに影を付加します | 3 |
text-underline-position | text-decoration プロパティを使用して設定したアンダーラインの位置を指定します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
@font-face | 「ウェブセーフ」なフォントの他に、web サイトがフォントをダウンロードし、使用することを可能にする規則 | 3 |
@font-feature-values | Allows authors to use a common name in font-variant-alternate for feature activated differently in OpenType | 3 |
font | 1回の宣言で全ての font プロパティを設定します | 1 |
font-family | テキストのフォント・ファミリーを指定します | 1 |
font-feature-settings | OpenType フォントで高度なタイポグラフィ機能の制御を可能にします | 3 |
font-kerning | カーニング情報(字間値)の利用を制御します | 3 |
font-language-override | 書体における言語固有のグリフの使用を制御します | 3 |
font-size | テキストのフォント・サイズを指定します | 1 |
font-size-adjust | フォントのフォールバックが発生したときにテキストの読みやすさを保持します | 3 |
font-stretch | フォントフェースの形状をnormal(通常)、condensed(幅狭)、expanded(幅広)から選択します | 3 |
font-style | テキストのフォント・スタイルを指定します | 1 |
font-synthesis | 欠落した書体(bold または italic)が、ブラウザによって合成することができるかを制御します | 3 |
font-variant | テキストをスモール・キャップ・フォントで表示するかどうかを指定します | 1 |
font-variant-alternates | @font-feature-values で定義された代替名に関連付けられた代替グリフの使用を制御します | 3 |
font-variant-caps | 大文字の代替グリフの使用を制御します | 3 |
font-variant-east-asian | 東アジア文字(例えば日本語や中国語)の代替グリフの使用を制御します | 3 |
font-variant-ligatures | 合字やコンテキストが、それが適用される要素のテキストコンテンツでの使用を制御します(?) | 3 |
font-variant-numeric | 数字、分数、序数マーカ(1st,2nd,3rd の st nd rd などを上付き小文字で表示)の代替グリフの使用を制御します | 3 |
font-variant-position | フォントのベースラインより上付きまたは下付きとして配置する小さいサイズの代替グリフの使用を制御します | 3 |
font-weight | フォントの太さを指定します | 1 |
プロパティ | 説明 | CSS |
---|---|---|
direction | テキストの方向/書字方向を指定します | 2 |
text-orientation | 行内のテキストの方向を定義します | 3 |
text-combine-upright | 単独の文字スペースの中へ複数文字の結合を指定します(訳注:縦書き内の横書きの字組み。縦中横ともいう) | 3 |
unicode-bidi | 同じ文書に複数の言語をサポートするため、テキストをオーバーライドする必要があるかどうかを設定するか、または返すために directionプロパティと一緒に使用します | 2 |
writing-mode | 3 |
プロパティ | 説明 | CSS |
---|---|---|
border-collapse | テーブルのボーダーを重ねるかどうかを指定します | 2 |
border-spacing | 隣接するセルのボーダー間の距離を指定します | 2 |
caption-side | テーブル表題の位置を指定します | 2 |
empty-cells | テーブルにおける空セルのボーダーと背景を表示するかどうかを指定します | 2 |
table-layout | テーブルに使用するレイアウト・アルゴリズムを設定します | 2 |
プロパティ | 説明 | CSS |
---|---|---|
counter-increment | カウンタを1以上増分します | 2 |
counter-reset | 1つ以上のカウンタを作成またはリセットします | 2 |
list-style | 1回の宣言で全てのリストのプロパティを設定します | 1 |
list-style-image | リスト項目のマーカに画像を指定します | 1 |
list-style-position | リスト項目のマーカがコンテンツ・フローの内側に現れるか外側に現れるかを指定します | 1 |
list-style-type | リスト項目のマーカのタイプを指定します | 1 |
プロパティ | 説明 | CSS |
---|---|---|
@keyframes | アニメーションのコードを指定します | 3 |
animation | animation-play-state と animation-fill-mode を除く、全 animation プロパティのショートハンド・プロパティ | 3 |
animation-delay | アニメーション開始までの待機時間を指定します | 3 |
animation-direction | アニメーションを交互に反転再生させるかどうかを指定します | 3 |
animation-duration | アニメーション1サイクル分の時間の長さを秒またはミリ秒で指定します | 3 |
animation-fill-mode | アニメーション再生中以外(完了後または待機中)の時の、要素のスタイルを指定します | 3 |
animation-iteration-count | アニメーションの再生回数を指定します | 3 |
animation-name | @keyframes アニメーションの名前を指定します | 3 |
animation-play-state | アニメーションが再生中か一時停止かを指定します | 3 |
animation-timing-function | アニメーションの速度曲線を指定します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
backface-visibility | 要素がスクリーンに面していない場合に、表示すべきかどうかを定義します | 3 |
perspective | 3D 要素の表示方法に視点を指定します | 3 |
perspective-origin | 3D 要素の底辺位置を指定します | 3 |
transform | 要素へ 2D 変形、または 3D 変形を適用します | 3 |
transform-origin | 変形した要素の位置変更を可能にします | 3 |
transform-style | ネストした要素を 3D 空間にレンダリングする方法を指定します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
transition | 4つの transition プロパティを設定するショートハンド・プロパティ | 3 |
transition-property | トランジション効果を適用する CSS プロパティの名前を指定します | 3 |
transition-duration | トランジション効果が完了するまでに掛かる時間を秒またはミリ秒で指定します | 3 |
transition-timing-function | トランジション効果の速度曲線を指定します | 3 |
transition-delay | トランジション効果がいつ始まるかを指定します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
box-sizing | どのようなサイズ設定プロパティ(幅と高さ)が含むべきかをブラウザに指示します | 3 |
content | 生成コンテンツを挿入するため、:before 擬似要素および :after 擬似要素と共に使用します | 2 |
cursor | 表示するカーソルのタイプを指定します | 2 |
ime-mode | テキストフィールドの入力メソッドエディタの状態を制御します | 3 |
nav-down | 下矢印ナビゲーションキーを使用する際に移動する場所を指定します | 3 |
nav-index | 要素のタブ順序を指定します | 3 |
nav-left | 左矢印ナビゲーションキーを使用する際に移動する場所を指定します | 3 |
nav-right | 右矢印ナビゲーションキーを使用する際に移動する場所を指定します | 3 |
nav-up | 上矢印ナビゲーションキーを使用する際に移動する場所を指定します | 3 |
outline | 1回の宣言で全ての outline プロパティを設定します | 2 |
outline-color | アウトラインの色を設定します | 2 |
outline-offset | アウトラインをずらして、ボーダー境界を越えてアウトラインを描きます | 3 |
outline-style | アウトラインのスタイルを設定します | 2 |
outline-width | アウトラインの幅を設定します | 2 |
resize | ユーザによる要素サイズを変更できるかどうかを指定します | 3 |
text-overflow | テキストが含まれる要素をはみ出した場合どうするかを指定します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
break-after | 生成ボックスの後における改ページ、改段または指定位置での改行動作を指定します | 3 |
break-before | 生成ボックスの前における改ページ、改段または指定位置での改行動作を指定します | 3 |
break-inside | 生成ボックスの内部における改ページ、改段または指定位置での改行動作を指定します | 3 |
段数 | 分割する要素の段数を指定します | 3 |
column-fill | 段をどのように埋めるかを指定します | 3 |
段の間隔 | 段の間隔を指定します | 3 |
段間の罫線 | 全ての column-rule-* プロパティを設定するためのショートハンド・プロパティ | 3 |
column-rule-color | 段の間のけい線の色を指定します | 3 |
column-rule-style | 段間のけい線のスタイルを指定します | 3 |
column-rule-width | 段間のけい線の幅を指定します | 3 |
column-span | 要素がまたがる段数を指定します | 3 |
column-width | 段の幅を指定します | 3 |
columns | column-width と column-count を設定するためのショートハンド・プロパティ | 3 |
widows | 要素の内部に改ページが発生する場合、ページの上部に残さなければならない行の最小数を設定します | 2 |
プロパティ | 説明 | CSS |
---|---|---|
orphans | 要素の内部に改ページが発生する場合、ページの下部に残さなければならない行の最小数を設定します | 2 |
page-break-after | 要素の後の改ページ動作を設定します | 2 |
page-break-before | 要素の前の改ページ動作を設定します | 2 |
page-break-inside | 要素の中の改ページ動作を設定します | 2 |
プロパティ | 説明 | CSS |
---|---|---|
marks | 文書にトンボ(印刷物の見当合わせ記号)および十字マークの双方、または何れか一方を追加します | 3 |
quotes | 埋め込み引用符の引用符の種類を設定します | 2 |
プロパティ | 説明 | CSS |
---|---|---|
filter | 要素を表示する前に、要素への効果(例えば、ぼかしやカラーシフト)を定義します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
image-orientation | ユーザエージェントが画像に適用する右または時計回りの方向の回転を指定します (多分、このプロパティは非推奨になり、機能は HTML に移動させられそうです) | 3 |
image-rendering | 画像が拡大・縮尺されるとき、画像のどの側面がエリアにとり最重要かについて、ブラウザにヒントを与えます | 3 |
image-resolution | 要素に、または要素で使用されるすべてのラスタ画像の固有な解像度を指定します | 3 |
object-fit | 置換された要素のコンテンツを、使用された高さと幅で作られたボックスに、どのようにフィットさせるかを指定します | 3 |
object-position | ボックス内の置換要素の配置を指定します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
mask | 3 | |
mask-type | 3 |
プロパティ | 説明 | CSS |
---|---|---|
mark | mark-before および mark-after プロパティを設定するためのショートハンド・プロパティ | 3 |
mark-after | オーディオストリームへ名前付きマーカの取り付けを可能にします | 3 |
mark-before | オーディオストリームへ名前付きマーカの取り付けを可能にします | 3 |
phonemes | 対応する要素に含まれるテキストに音声発音を指定します | 3 |
rest | rest-before および rest-after プロパティを設定するためのショートハンド・プロパティ | 3 |
rest-after | 要素内容を話した後の休憩・間を指定します | 3 |
rest-before | 要素内容を話す前の休憩・間を指定します | 3 |
voice-balance | 左右のチャンネルのバランスを指定します | 3 |
voice-duration | 選択した要素内容をレンダリングするのに掛かる時間を指定します | 3 |
voice-pitch | 話し声の平均な声の高さ(周波数)を指定します | 3 |
voice-pitch-range | 声の抑揚(周波数の変化幅)を指定します | 3 |
voice-rate | 話す速度を制御します | 3 |
voice-stress | 強調の度合い(強い・弱い・単調)を示します | 3 |
voice-volume | 音声合成で波形出力の振幅を参照します | 3 |
プロパティ | 説明 | CSS |
---|---|---|
marquee-direction | コンテンツを移動する方向を設定します | 3 |
marquee-play-count | コンテンツ移動の回数を設定します | 3 |
marquee-speed | コンテンツのスクロールの速さを設定します | 3 |
marquee-style | Sコンテンツ移動のスタイルを設定します | 3 |