欢迎访问 生活随笔!

生活随笔

当前位置: 首页 > 前端技术 > CSS >内容正文

CSS

002_CSS基础语法

发布时间:2025/4/17 CSS 44 豆豆
生活随笔 收集整理的这篇文章主要介绍了 002_CSS基础语法 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

1. CSS语法

1.1. CSS规则集(rule-set)由选择器和声明块组成。

1.2. 选择器通常是您需要改变样式的html元素。

1.3. 声明块包含一条或多条声明, 多条声明使用分号分割。

selector {declaration1; declaration2; ... declarationN; }

1.4. 声明块使用花括号括起来。

1.5. 每条声明由一个属性和一个或一列值组成。

1.6. 属性(property)是您希望设置的样式属性(style attribute)。属性和值被冒号分开。

selector {property: value; }

2. 记得写引号

2.1. 如果值为若干单词, 则要给值加引号:

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

3. 多声明

3.1. 如果要定义不止一个声明, 则需要用分号将每个声明分开。下面的例子展示出如何定义一个红色文字的居中段落。最后一条规则是不需要加分号的, 因为分号在英语中是一个分隔符号,不是结束符号。然而, 大多数有经验的设计师会在每条声明的末尾都加上分号, 这么做的好处是, 当你从现有的规则中增减声明时, 会尽可能地减少出错的可能性。就像这样:

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

4. 换行和空格的使用

4.1. 大多数样式表包含不止一条规则, 而大多数规则包含不止一个声明。多条声明中换行和空格的使用使得样式表更容易被编辑:

body {color: #000000;background: #FFFFFF;margin: 10px;padding: 0;font-family: Georgia, Palatino, serif; }

4.2. 不要在属性值与单位之间留有空格。假如你使用"margin: 10 px;"而不是"margin: 10px;", 它仅在IE6中有效, 但是在Mozilla/Firefox或Netscape中却无法正常工作。

4.3. 是否包含换行和空格并不会影响CSS在浏览器中的工作效果。

5. 大小写

5.1. 与xhtml不同, CSS对大小写不敏感。不过存在一个例外: 如果涉及到与html文档一起工作的话, class和id名称对大小写是敏感的。

6. 继承

6.1. 根据CSS规则子元素从父元素继承属性。

body {font-family: Verdana, sans-serif; }

6.2. 根据上面这条规则, 站点的body元素将使用Verdana字体。通过CSS继承, 子元素(这些子元素诸如: p, td, ul, ol, ul, li, dl, dt和dd等)将继承最高级元素(在本例中是: body)所拥有的属性。不需要另外的规则, 所有body 的子元素都应该显示Verdana字体, 子元素的子元素也一样。并且在大部分的现代浏览器中, 也确实是这样的。

总结

以上是生活随笔为你收集整理的002_CSS基础语法的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。