■ 什么是CSS
CSS是层叠样式表(cascading style sheets)的简称,有时也称为CSS样式表或级联样式表
CSS也是一种标记语言
■ CSS的用途
CSS的主要使用场景就是美化网页,布局页面,让网页更加丰富多彩,布局更加灵活自如
CSS主要用于设置HTML页面中的文本内容(字体,大小,对齐方式),图片的外形(宽高,边框样式,边距等)以及版面的布局和外观显示样式
简单理解,CSS可以美化HTML,让HTML更漂亮,让页面布局更简单
总结:
▶ HTML主要做结构,显示元素内容;CSS美化HTML,布局网页
▶ CSS最大的价值:由HTML专注取做结构呈现,样式交给CSS,即结构与样式相分离
■ CSS规范
使用HTML时,需要遵从一定的规范,CSS也是如此,要想熟练地使用CSS对网页进行修饰,首先需要了解CSS的样式规则
CSS规则由以下两个主要的部分构成:
▶ 选择器
▶ 一条或多条声明
语法格式:选择器 { 样式列表 }
语法说明:
▶ 选择器是用于指定CSS样式的HTML标签,花括号内是对该对象设置的具体样式
▶ 属性和属性值是以键值对的形式出现
▶ 属性和属性值之间用英文冒号分开
▶ 多个键值对之间用英文分号进行分隔
示例
<head> <style> p { color: red; font-size: 12px; } <style> </head> <body> <p> 这是一个段落。</p> </body>
■ CSS代码风格
以下代码书写风格不是强制规范,而是符合实际开发书写方式
□ 样式格式书写
紧凑风格
h3 {color:red; font-size:10px}
展开风格(推荐)
h3 { color: red; font-size: 20px; }
□ 大小写规范
强烈推荐样式选择器,属性名,属性值关键字全部使用小写字母,特殊情况除外
□ 空格规范
CSS应遵循以下空格规范:
▶ 属性值前面,冒号后面,保留一个空格
▶ 选择器和大括号中间保留空格
示例
h3 { color: red; font-size: 20px; }