
CSS一覧
とどんな時に使うのかを説明する別サイトリンクです。
スピード重視なので@、a~zで並べてます。ご自由に利用下さい。
@charset スタイルシートで使用される文字セットを定義
@font-face 使用する外部のフォントを定義
@import 指定した外部のスタイルシートを読み込む
@keyframes アニメーションの動きを指定
@media メディア毎の条件をを定義
@page 文書(html)を印刷するとき定義
align-content コンテナ内の行の揃え方
align-items コンテナ内の垂直方向の揃え方
align-self flexコンテナの垂直(縦)位置を個別に指定
animation アニメーションの設定
animation-delay アニメーションのディレイ
animation-direction アニメーションの方向
animation-duration アニメーションの再生時間
animation-fill-mode アニメーションの再生前後のスタイル
animation-iteration-count アニメーションの繰り返し
animation-name アニメーションのキーフレーム
animation-play-state アニメーションの再生と一時停止
animation-timing-function アニメーション速度
backface-visibility 裏面の表示
background 背景全般の設定
background-attachment 背景画像のスクロール
background-blend-mode 背景をブレンド
background-clip 背景画像の表示エリア
background-color 背景色の設定
background-image 背景画像の設定
background-origin 背景画像の表示位置の基点
background-position 背景画像の表示位置の設定
background-repeat 背景画像の繰返し設定
background-size 背景画像の表示サイズ設定
border 罫線の設定
border-bottom 罫線の底辺の設定
border-bottom-color 罫線の底辺の色設定
border-bottom-left-radius左下の角丸
border-bottom-right-radius 右下の角丸
border-bottom-style 罫線の底辺のスタイル設定
border-bottom-width 罫線の底辺の太さ設定
border-collapse テーブルの罫線の表示方法
border-color 罫線の色設定
border-image 画像を使った罫線の表示
border-image-outset ボーダーイメージエリアを広げる
border-image-repeat 画像ボーダーの繰り返し方法
border-image-slice 画像のボーダー使用範囲
border-image-source ボーダーの使用画像ファイル
画像ボーダーの太さ
border-left罫線の左辺の設定
border-left-color 罫線の左辺の色設定
border-left-style 罫線の左辺のスタイル設定
border-left-width 罫線の左辺の太さ設定
border-radius 角丸の設定
border-right 罫線の右辺の設定
border-right-color 罫線の右辺の色設定
border-right-style 罫線の右辺のスタイル設定
border-right-width 罫線の右辺の太さ設定
border-spacing テーブルの罫線の間隔
border-style 罫線のスタイル設定
border-top 罫線の上辺の設定
border-top-color 罫線の上辺の色設定
border-top-left-radius 左上の角丸
border-top-right-radius 右上の角丸
border-top-style 罫線の上辺のスタイル設定
border-top-width 罫線の上辺の太さ設定
border-width 罫線の太さ設定
bottom 基点の下辺からの距離
box-shadow ボックスの影付け
box-sizing ボックスの大きさの算出方法
caption-side テーブルのキャプションの表示位置
clear 回り込みの解除 clip 画像の切り抜き
clip-path 画像の切り抜き
color 文字の色
column-count マルチカラムのカラムの数
column-fill マルチカラムのカラムのバランス
column-gap マルチカラムのカラムの間隔
column-rule マルチカラムの区切り線
column-rule-color マルチカラムの区切り線の色
column-rule-style マルチカラムの区切り線のスタイル
column-rule-width マルチカラムの区切り線の太さ
column-span マルチカラムのカラムをまたがって表示
column-width マルチカラムのカラムの横幅
columns マルチカラムのカラムの数と横幅
content コンテンツの挿入・置換
counter-increment カウンターの増減値
counter-reset カウンターの初期値
cue-after 要素の後の合図音
cue-before 要素の前の合図音
cursor カーソルの種類
direction 書字方向
display ボックスの種類
empty-cells 空セルの表示
filter 画像に各種効果
flex flex-grow,flex-shrink,flex-basisをまとめて指定
flex-basis flexboxアイテムの幅を調整
flex-direction flexboxアイテムの配置(縦/横)
flex-flow flex-directionとflex-wrapまとめて指定
flex-grow flexboxアイテムの自動幅調整(伸ばす)
flex-shrink flexboxアイテムの自動幅調整(縮む)
flex-wrap flexboxアイテムの折り返し
float 配置と回り込み
font 文字のデザイン
font-family フォント
font-feature-settings OpenTypeフォントの字形の切替え
font-kerning 字間スペース
font-size 文字の大きさ
font-size-adjust 文字サイズの自動調節
font-stretch フォントの形状(幅広・幅狭)
font-style 斜体のスタイル
font-synthesis 太字や斜体を持たないフォントの表示方法
font-variant フォントの変換ルール
font-variant-alternates 代替文字の置き換え指定
font-variant-caps 英大文字での表示制御
font-variant-east-asian 漢字の表示指定
font-variant-ligatures 合字の制御指定
font-variant-numeric 数値の表示形式指定
font-variant-position 上付き文字・下付き文字の指定
font-weight 文字の太さ
grid グリッドコンテナをまとめて指定
grid-area gridのstart,endをまとめて指定
grid-auto-columns 自動生成されるグリッドアイテムの幅
grid-auto-flow グリッドアイテムの自動配置方法
grid-auto-rows 自動生成されるグリッドアイテムの高さ
grid-column グリッドアイテムの列開始/終了をまとめて指定
grid-column-end グリッドアイテムの列終了位置
grid-column-start グリッドアイテムの列開始位置
grid-gap グリッドアイテムの余白をまとめて指定
grid-gap-columns グリッドアイテム列間の余白
grid-gap-rows グリッドアイテム行間の余白
grid-row グリッドアイテムの行開始/終了をまとめて指定
grid-row-end グリッドアイテムの行終了位置
grid-row-start グリッドアイテムの行開始位置
grid-template grid-templateをまとめて指定
grid-template-areas グリッドコンテナの名前を指定
grid-template-columns グリッドコンテナの幅を指定
grid-template-rows グリッドコンテナの高さを指定
height 高さ
hyphens ハイフネーション(単語途中の改行指定)の利用
image-rendering 画像倍率表示時の指定
justify-content コンテナ内の水平方向の揃え方
left 基点の左辺からの距離
etter-spacing 文字の間隔
line-break 禁則処理のルール(改行位置指定)
line-height 行の高さ
list-style リストマークのデザイン
list-style-image リストマークの画像
list-style-position リストマークの表示位置
list-style-type リストマークの種類
margin マージンの大きさ
margin-bottom 下マージン
margin-left 左マージン
margin-right 右マージン
margin-top 上マージン
max-height 高さの最大値
max-width 横幅の最大値
min-height 高さの最小値
object-fit ボックスに合わせた画像サイズの調節
object-position ボックス内での画像の表示位置
opacity 透明度
order flexコンテナ内の並び順
orphans 前ページの末尾に最小限必要な行数
outline アウトラインの表示
outline アウトラインの表示
outline-color アウトラインの色
outline-offset アウトラインのオフセット
outline-style アウトラインのスタイル
outline-width アウトラインの太さ
overflow オーバーフローしたコンテンツの表示
overflow-wrap 単語の途中で改行指定
overflow-x 横方向にオーバーしたコンテンツの表示
overflow-x 横方向にオーバーしたコンテンツの表示
overflow-x 横方向にオーバーしたコンテンツの表示
overflow-y 縦方向にオーバーしたコンテンツの表示
padding パディングの大きさ
padding-bottom 下パディング
padding-left 左パディング
padding-right 右パディング
padding-top 上パディング
page 特定の名前を付けてページを定義
page-break-after 改ページの位置:ボックス後
page-break-before 改ページの位置:ボックス前
page-break-inside 改ページの位置:ボックス内
perspective 子要素の奥行きの指定
perspective-origin 子要素の奥行きのx軸・y軸方向の位置
pointer-events マウスイベントのターゲット制御
position 配置方法
quotes 引用符
resize ボックスのリサイズ
right 基点の右辺からの距離
ruby-align ルビの揃え方
ruby-merge ルビの分割
ruby-position ルビの表示位置
size ページサイズを定義
tab-size タブ幅
table-layout テーブルの表示方法
text-align 横(水平)方向の文字位置
text-decoration 文字の装飾線の表示
text-decoration 文字の装飾線の表示
text-decoration-color 文字の装飾線の色を指定
text-decoration-line 文字の装飾線の位置を指定
text-decoration-style 文字の装飾線の種類を指定
text-emphasis 圏点スタイルをまとめて指定
text-emphasis-color 圏点の色を指定
text-emphasis-position 圏点の位置を指定
text-emphasis-style 圏点の形を指定
text-indent 1行目のインデント
text-justify 両端揃えの調節方法
text-overflow オーバーフローしたテキストの省略表示
text-shadow 文字の影付け
text-transform 字形の変換
text-underline-position 文字下線の位置を指定
top 基点の上辺からの距離
transform 要素の変形
transform-origin 要素変形の起点
transform-style 要素重なり時の3D表示
transition トランジションの設定
transition-delay トランジションのディレイ
transition-duration トランジションの再生時間
transition-property トランジション対象のCSSプロパティ
transition-timing-function トランジションの速度
unicode-bidi 双方向アルゴリズムの変更
vertical-align 縦(垂直)方向の文字位置
visibility 表示の有無 voice-family 声の種類
white-space 改行コード・タブ・スペースの表示
widows 次ページの先頭に最小限必要な行数
width 横幅
word-break 自動改行のルール
word-spacing 単語の間隔
word-wrap 長い単語の改行ルール
writing-mode 文字の縦書き
z-index ボックスの重なり順