2

ご存知のように、css では省略形のプロパティを使用できます。しかし、プロパティ値の順序が重要であることがわかりました。

'border:1px 赤実線;' 'border: 1px solid red;' と同じです。


ただし、「font:italic bold 12px/20px」は「font:italic 12px/20px bold;」と等しくありません。

マニュアルを注意深く読みましたが、プロパティ値の順序に関する内容が見つかりません。

4

4 に答える 4

2

覚えておくのに役立つチート シートを次に示します

于 2012-10-01T13:02:18.657 に答える
1

順序の関連性は、プロパティごとに定義されます。たとえば、省略形の説明ではfont次の構文を使用します。

[ [ <'font-style'> || <'font-variant'> || <'font-weight'> ]? <'font-size'>
[ / <'line-height'> ]? <'font-family'> ] | caption | icon | menu | message-box |
 small-caption | status-bar | inherit

これは少し厄介に見えますが、使用されるメタ表記の鍵はセクション1.4.2CSSプロパティ定義にあります。それは、とりわけ、次のように述べています。

  1. いくつかの並置された単語は、それらすべてが指定された順序で発生する必要があることを意味します。
  2. バー(|)は、2つ以上の選択肢を区切ります。そのうちの1つだけが出現する必要があります。
  3. 二重小節(||)は、2つ以上のオプションを区切ります。1つ以上のオプションは、任意の順序で発生する必要があります。

したがって、フォントスタイル、フォントバリアント、およびフォントの太さは任意の順序で表示される可能性があり、すべて省略可能ですが、存在する場合は、フォントサイズとフォントファミリの前に配置する必要があります。これらは両方とも必須であり、この順序で表示される必要があります。

幸いなことに、ほとんどのプロパティはより単純です。アイテムの役割をフォーマットから推測できるようにする設計のため、ほとんどの場合、値内のアイテムの順序は重要ではありません。また、省略形は必要ありませんfont。代わりに、いつでも個々のフォントプロパティを書き留めることができます。

于 2012-10-01T14:49:40.780 に答える
0

フォントの略記の良いリファレンスは次のとおりです: https://www.sitepoint.com/introduction-css-shorthand/ - sitepoint リファレンス全体は実際にはかなり良いです。

于 2012-10-01T13:05:41.683 に答える
0
font-weight: bold;
font-style: italic;
font-variant: small-caps;
font-size: 1em;
line-height: 1.5em;
font-family: verdana,sans-serif

になります:

font: bold italic small-caps 1em/1.5em verdana,sans-serif

これが注文です。

于 2012-10-01T13:02:56.367 に答える