选择器 { 属性1: 值1; 属性2: 值2; 属性3: 值3; }
上面是CSS语法的基本格式。其中,选择器用于选择一个或多个元素来设置样式,花括号内则是一组属性和值的声明。属性用于定义样式,而值则用于规定属性的具体实现。下面分别详细介绍选择器、属性和值。
选择器
选择器是用于选择一个或多个元素来设置样式的。如下所示,其中“p”是标签选择器,用于选择所有的段落元素。
/* 选择所有的段落元素 */ p { 属性: 值; }
除了标签选择器,还有很多其他的选择器,如类选择器(.class)、ID选择器(#id)、后代选择器(parent child)、并集选择器(selector1,selector2)等等。不同的选择器可以用于不同的需求,比如只选中特定的元素或者同时选择多个元素。
属性
属性用于定义样式,如下所示,其中“color”是属性,表示文字颜色,而“red”则是属性值,表示文字颜色为红色。
/* 文字颜色为红色 */ p { color: red; }
CSS有很多属性可以控制不同的效果,如颜色、大小、字体、边框、背景等等。需要注意的是,不同的属性有不同的取值范围和单位,如例子中的“color”只能取值于颜色名称或十六进制值,而“font-size”还可以加上单位(px, em, rem等)。必须注意属性名的大小写,如“color”,只有小写的“color”才是正确的写法,如果写成“Color”或“COLOR”都将是错误的。
值
值用于规定属性的具体实现,如下所示,其中“red”就是属性“color”的属性值,表示文字颜色为红色。
/* 文字颜色为红色 */ p { color: red; }
CSS中的值有很多类型,如颜色、长度、百分比、字体等等。需要注意的是,不同的属性有不同的值类型和取值范围,如长度单位(px, em, rem等)只能用于某些属性中。
结语
以上就是CSS的基本语法,包括选择器、属性和值三个部分。熟练掌握这些,将会使你的网页制作更加得心应手。