Basic syntax na CSS

语法 na CSS

CSS guan zhe you liang ge zhu yao de bu fen: xuanzhe, yu yi tiao huo duo tiao shengming.

selector {Shengming1; Shengming2; ... ShengmingN }

Xuan zhe shi tong chang ni xiang gai bian yang shi de HTML yuan su.

Mei tiao shengming you yi ge shuxing he yi ge zhi zhi.

Shuxing (property) shi ni xiang she zhi de yang shi shuxing (style attribute). Mei ge shuxing you yi ge zhi. Shuxing he zhi bei ma zhong fen kai.

selector {property: value}

Xia mian zhe xing ma ma de zuo yong shi jiang h1 yuan su nei de wenz i se deng wei hong se, dama bing jiang zi ti da xiao she zhi wei 14 xiang sui.

Zai zhe ge li, h1 shi xuanzhe, color he font-size shi shuxing, red he 14px shi zhi.

h1 {color:red; font-size:14px;}

Xia mian de tu shi she xian shang mian zhe duan ma ma de jie gou:

语法 na CSS

Tishi:Qing shi yong hua kuo hao bao bao shengming.

Zhi de bu tong xie fa he dan wei

Chu yu yingwen danyan red, women hai neng shi yong shi li jing zhi hao #ff0000:

p { color: #ff0000; }

Weile jie shao zhei yi, women keyi shi yong CSS de shuie xing:

p { color: #f00; }

Women hai neng chong hai zhong fang fa shi yong RGB zhi:

p { color: rgb(255,0,0); }
p { color: rgb(100%,0%,0%); }

Qing jiao zhong, dang shi yong RGB baiji fen bi时, jing rán dama wei 0 shi, ye yao xie baiji fen bi hao. Dan zai qi ta qing kuang shang, bu xuyao zhe me zuo. Shi bu shi, dang chizi wei 0 xiang sui shi, 0 hou bu xuyao shi yong px dan wei, yin wei 0 ji shi 0, guan dama dan wei shi shenme.

Ji de xie yin hao

Tishi:Ri wei duo ge danyan, na yao gei zhi jia yinhao:

p {font-family: "sans serif";}

Chong duan shengming:

Tishi:Iya ta a baiyi, kana waiya zai yinshiya zuowu dama, kan kai zai dama. Dama kan zai jie shu shi, bu shi jie shu hao. Ran hui, da baiyi she zhi jingyan she jishu she hua she, zai mege shenming de zhongwai dou jia fenhao, zhege zuo fa de youdian shi, dama neng hou zuo shenme jia shenming, dou neng zui da de jian shi cuowu xing. Dama xiang zhe yang:

p {text-align:center}; color:red;}

You should describe only one property per line, which can enhance the readability of the style definition, like this:

p {
  text-align: center;
  color: black;
  font-family: arial;
}

Spaces and case sensitivity

Most style sheets contain more than one rule, and most rules contain more than one declaration. The use of multiple declarations and spaces makes style sheets easier to edit:

body {
  color: #000;
  background: #fff;
  margin: 0;
  padding: 0;
  font-family: Georgia, Palatino, serif;
  }

Whether it contains spaces will not affect the working effect of CSS in the browser, just like, unlike XHTML, CSS is not sensitive to case. However, there is an exception: if it involves working with HTML documents, class and id names are sensitive to case.