CSSやCSS3でfont-familyに直接書き込んで初期値に指定する方法はあるか？

調べた限りでは、font-familyに直接書き込んで初期設定に指定する方法はありませんでした。
やはり、font-family:inherit;で親要素の継承しかありませんか？

よろしくお願いします。

追記
例えば、font-family:default;
としたら、フォントの種類を初期設定にできるようになる書き方です。

kei344

2018/01/24 16:52

「初期値に設定する言語」とは何でしょう。もう少し具体的にしてください。

kei344

2018/01/24 17:05

「直接書き込んで初期設定に指定」とは具体的にどのような書き方で実現したいのでしょうか。何が問題で、どういう記述をどのような書き方で実現したいのかを具体的に書けば回答が付く可能性があります。

行動規範の内容に同意します

回答3件

ベストアンサー

もしかしてinitial?

下記は, body要素で設定されたfont-familyプロパティを子div要素側で打ち消して初期値としています.

HTML
1<body>
2あ
3<div>あ</div>
4</body>

CSS
1body{
2	font-family: serif;
3}
4body>div{
5	font-family: initial;
6}

NOTE:
同様に親要素の設定に合わせる意味を持つunsetというものもあるようです.

参考
https://developer.mozilla.org/ja/docs/Web/CSS/initial
https://developer.mozilla.org/ja/docs/Web/CSS/unset

投稿2018/01/24 18:38

編集2018/01/24 18:42

defghi1977

総合スコア4756

質問者さんの「フォントの種類を初期設定」の意味を取り間違えているかもですが、CSSリセット等で最初にフォント指定をしなければ良いだけでは無いでしょうか？

どのような場面（webサイト等）での想定か分からないのですが、デザイン面で見ると、ある程度（せめて明朝系かゴシック系か位）の指定を掛ける方が良いかと個人的には思います。

投稿2018/01/25 00:30

yoshinavi

総合スコア3523

対応ブラウザをそこまで気にしないなら CSS variables を利用したらできるとは思います。

CSS
1:root {
2  --main-font: impact;
3}
4p {
5  font-family: var(--main-font);
6}
7```**動くサンプル：**[https://jsfiddle.net/w69tpr6w/](https://jsfiddle.net/w69tpr6w/)
8
9---
10
11【CSS Variables(カスタムプロパティ)でCSSがより便利に！ - Qiita】
12[https://qiita.com/kyota/items/bd5d291809415cc2d7b1](https://qiita.com/kyota/items/bd5d291809415cc2d7b1)
13
14【Web制作がめっちゃ捗る！CSS変数の基礎と実践テクニック - WPJ】
15[https://www.webprofessional.jp/practical-guide-css-variables-custom-properties/](https://www.webprofessional.jp/practical-guide-css-variables-custom-properties/)
16
17【CSSの変数を使う - CSS | MDN】
18[https://developer.mozilla.org/ja/docs/Web/CSS/Using_CSS_variables](https://developer.mozilla.org/ja/docs/Web/CSS/Using_CSS_variables)
19
20---
21
22対応ブラウザを気にするならSCSSなどで書くようにすれば変数も使えます。
23
24【CSSのメタ言語Sass(SCSS)、LESSの完全入門 - Qiita】
25[https://qiita.com/ritukiii/items/67b3c50002b48c6186d6](https://qiita.com/ritukiii/items/67b3c50002b48c6186d6)
26
27【Sass(Scss) Memo: 変数 | Culture27】
28[http://www.culture27.com/blog/2011/07/sass_memo_2](http://www.culture27.com/blog/2011/07/sass_memo_2)