スタイルシートで使われるプロパティと値の読み方 property and value of Cascading Style Sheets

スタイルシートで使われているプロパティ、値・ファンクションの読み方をご紹介します。
ほとんどは英単語の読みですが、間違えて覚えてしまう人もいるため、掲載してみました。

すべてのプロパティ、値・ファンクションをご紹介しているわけではありませんので予めご了承ください。

プロパティ

プロパティ名 読み方
* アスタリスク
@charset アットキャラセット
@font-face アットフォントフェイス
@import アットインポート
@media アットメディア
@page アットページ
@support アットサポート
animation アニメーション
background バックグラウンド
background-attachment バックグラウンドアタッチメント
background-clip バックグラウンドクリップ
background-color バックグラウンドカラー
background-image バックグラウンドイメージ
background-origin バックグラウンドオリジン
background-position バックグラウンドポジション
background-repeat バックグラウンドリピート
background-size バックグラウンドサイズ
border ボーダー
border-bottom ボーダーボトム
border-collapse ボーダーコラプス
border-color ボーダーカラー
border-image ボーダーイメージ
border-image-outset ボーダーイメージアウトセット
border-image-repeat ボーダーイメージリピート
border-image-slice ボーダーイメージスライス
border-image-source ボーダーイメージソース
border-image-width ボーダーイメージウィズ
border-left ボーダーレフト
border-radius ボーダーレイディアス
border-right ボーダーライト
border-spacing ボーダースペーシング
border-style ボーダースタイル
border-top ボーダートップ
border-width ボーダーウィズ
bottom ボトム
box-decoration-break ボックスデコレーションブレイク
box-flex ボックスフレックス
box-flex-group ボックスフレックスグループ
box-lines ボックスラインズ
box-pack ボックスパック
box-shadow ボックスシャドウ
choices チョイシス
clear クリア
color カラー
column-fill カラムフィル
column-gap カラムギャップ
column-rule カラムルール
columns カラムス
cursor カーソル
display ディスプレイ
flex フレックス
float フロート
font フォント
font-family フォントファミリー
font-size フォントサイズ
font-style フォントスタイル
font-variant フォントバリアント
font-weight フォントウェイト
height ハイト
hover ホバー
href エイチレフ
left レフト
letter-spacing レタースペーシング
line-height ラインハイト
link リンク
list-style リストスタイル
list-style-image リストスタイルイメージ
list-style-position リストスタイルポジション
list-style-type リストスタイルタイプ
margin マージン
margin-bottom マージンボトム
margin-left マージンレフト
margin-right マージンライト
margin-top マージントップ
marker-offset マーカーオフセット
opacity オパシティ
optional オプショナル
outline アウトライン
overflow オーバーフロー
padding パディング
padding-bottom パディングボトム
padding-left パディングレフト
padding-right パディングライト
padding-top パディングトップ
perspective パースペクティブ
position ポジション
required リクワイヤード
resize リサイズ
right ライト
scrollbar-3dlight-color スクロールバースリーディーライトカラー
scrollbar-arrow-color スクロールバーアローカラー
scrollbar-base-color スクロールバーベースカラー
scrollbar-darkshadow-color スクロールバーダークシャドーカラー
scrollbar-face-color スクロールバーフェイスカラー
scrollbar-highlight-color スクロールバーハイライトカラー
scrollbar-shadow-color スクロールバーシャドーカラー
scrollbar-track-color スクロールバートラックカラー
selection セレクション
text-align テキストアライン
text-decoration テキストデコレーション
text-emphasis テキストエンファシス
text-indent テキストインデント
text-justify テキストジャスティファイ
text-shadow テキストシャドウ
top トップ
transform トランスフォーム
transform:matrix トランスフォーム マトリクス
transform:rotate トランスフォーム ローテート
transform:scale トランスフォーム スケール
transform:skew トランスフォーム スキュー
transform:translate トランスフォーム トランスレート
transition トランジション
transition-delay トランジションディレイ
transition-duration トランジションデュレーション
transition-property トランジションプロパティ
transition-timing-function トランジションタイミングファンクション
transparent トランスペアレント
vertical-align バーティカルアライン
visibility ビジビリティー
voice-family ヴォイスファミリー
white-space ホワイトスペース
width ウィズ、ウィトゥス
word-break ワードブレイク
word-wrap ワードラップ
z-index ゼットインデックス

値・ファンクション

値・ファンクション名 読み方
absolute アブソリュート、アブソルート
active アクティブ
auto オート
block ブロック
bold ボールド、ボルド
both ボース
calc キャルク、キャルキュ
center センター
collapse コラプス
fixed フィクスドゥ
hidden ヒドゥン
inline インライン
itaric イタリック
linear-gradient リニアグレイディエント
none ナン
normal ノーマル
radial-gradient ラジアルグレイディエント
relative レラティブ
rgba アールジービーエイ
underline アンダーライン
valid ヴァリッド
visited ビジティッドゥ