CSS Web Safe Fonts関数要素使い方・書き方例 CSS サンプル

2018-07-01 css

ページコンテンツ

▼Web Safe FontsCSS プロパティとは
▼ プロパティ Web Safe Fonts
▼実例コード 1
▼フォントの組み合わせサンプル
▼Serif Fonts：例
▼Sans-Serif Fonts：例
▼Monospace Fonts：例
▼Cursive Fonts：例
▼fantasy Fonts：例

`Web Safe Fonts` CSS プロパティとは

トピック：Webセーフフォントは、一般的でWindows,Mac,Linuxなどの幅広いオペレーティングシステムに存在する可能性が最も高いフォント。

プロパティ `Web Safe Fonts`

実例コード 1

サンプルコードを試す

.sans-serif-font {
font-family: Arial, Helvetica, sans-serif;
}
.serif-font {
font-family: "Times New Roman", Times, serif;
}
.monospace-font {
font-family: "Courier New", Courier, monospace;
}

すべてのフォントがすべてのコンピュータシステムで利用できないため、Webページで使用しようとしているフォントが現れない場合がある

フォントの組み合わせサンプル

フォントファミリー	ノーマル	太文字
`Arial, Helvetica, sans-serif`	This is normal text.	This is bold text.
`"Times New Roman", Times, serif`	This is normal text.	This is bold text.
`"Courier New", Courier, monospace`	This is normal text.	This is bold text.

Serif Fonts：例

フォントファミリー	ノーマル	太文字
`Georgia, serif`	This is normal text.	This is bold text.
`"Times New Roman", Times, serif`	This is normal text.	This is bold text.
`"Palatino Linotype", Palatino, "Book Antiqua", serif`	This is normal text.	This is bold text.

Sans-Serif Fonts：例

フォントファミリー	ノーマル	太文字
`Arial, Helvetica, sans-serif`	This is normal text.	This is bold text.
`"Arial Black", Gadget, sans-serif`	This is normal text.	This is bold text.
`"Comic Sans MS", cursive, sans-serif`	This is normal text.	This is bold text.
`Impact, Charcoal, sans-serif`	This is normal text.	This is bold text.
`"Lucida Sans Unicode", "Lucida Grande", sans-serif`	This is normal text.	This is bold text.
`Tahoma, Geneva, sans-serif`	This is normal text.	This is bold text.
`"Trebuchet MS", Helvetica, sans-serif`	This is normal text.	This is bold text.
`Verdana, Geneva, sans-serif`	This is normal text.	This is bold text.

Monospace Fonts：例

フォントファミリー	ノーマル	太文字
`Courier, monospace`	This is normal text.	This is bold text.
`"Courier New", Courier, monospace`	This is normal text.	This is bold text.
`"Lucida Console", Monaco, monospace`	This is normal text.	This is bold text.

Cursive Fonts：例

フォントファミリー	ノーマル	太文字
`"Comic Sans MS", cursive`	This is normal text.	This is bold text.
`"Courier New", Courier, monospace`	This is normal text.	This is bold text.
`"Lucida Console", Monaco, monospace`	This is normal text.	This is bold text.

fantasy Fonts：例

フォントファミリー	ノーマル	太文字
`papyrus`	This is normal text.	This is bold text.
`herculanum`	This is normal text.	This is bold text.
`"party let"`	This is normal text.	This is bold text.
`"curlz mt"`	This is normal text.	This is bold text.
`harrington`	This is normal text.	This is bold text.
`fantasy`	This is normal text.	This is bold text.

フォント(Verdana,Georgia, "Comic Sans MS", "Trebuchet MS", "Arial Black",Impact)は、WindowsおよびMacOSでは動作するが、Unix + Xでは動作しない

：Web Safe Fonts 関連記事

CSS Web Safe Fonts関数要素使い方・書き方例 CSS サンプル — CSS Web Safe Fonts| 使い方 | 書き方 | サンプル | セレクタ値 | 属性入門 | CSS マニュアル – WebRef

タグ:

#CSS フォント
#CSS プロパティ