CSS 语法

 

CSS 语法

 

CSS declaration

 

CSS declaration blocks

 

CSS selectors and rules

一个HTML元素可能匹配多个选择器，因此多个规则可能多次设定特定的属性多次。此时由CSS来决定这些规则的优先级。

在一组选择器中，若某个选择器是无效的。此时这组选择器中，除去这个无效的选择器之外的其他选择器依然有效。

 

CSS statements

CSS规则是样式表的主要建构块，CSS rules是所谓CSS语句的一种类型。还有如下所示的其他类型：

At-rules

@charset and @import (metadata)

@media or @document

@font-face (descriptive information)

@import 'custom.css';
/*将其他CSS文档引入当前CSS文档*/

Nested statements 是 At-rules 的特别子集。

@media 所定义的规则，在设备浏览器的条件与此规则匹配时，此规则得到应用。

@supports 所定义的规则，在设备浏览器实际支持此测试功能时，此规则得到应用。

@document 所定义的规则，在当前页面满足某些条件时，此规则得到应用。

@media (min-width: 801px) {
  body {
    margin: 0 auto;
    width: 800px;
  }
}
/*当页面宽度超过 800 pixel 时，此规则得到应用*/

CSS Comments

CSS 注释，以 '/*' 开始，以 '*/' 结束。

Shorthand

某一些 CSS 属性，如 font, background, padding, border, margin 就被叫做速记属性。

例如以下代码所示：

/* in shorthand like padding and margin, the values are applied
   in the order top, right, bottom, left (the same order as an analog clock). There are also other 
   shorthand types, for example two values, which set for example
   the padding for top/bottom, then left/right */
padding: 10px 15px 15px 5px;

padding-top: 10px;
padding-right: 15px;
padding-bottom: 15px;
padding-left: 5px;

background: red url(bg-graphic.png) 10px 10px repeat-x fixed;

background-color: red;
background-image: url(bg-graphic.png);
background-position: 10px 10px;
background-repeat: repeat-x;
background-scroll: fixed;