一.CSS基本语法
语法格式:
选择符{
属性:值
}
例如:
二.在网页中添加CSS的方法
1.内嵌样式
将样式代码写在标记里,使用style作为属性,样式语句作为属性值。
2.内部样式
使用<style>标记将样式代码写到HTML的<head></head>里面。
3.外部样式
1)链接样式表
创建一个以.css为拓展名的CSS文件,在需要的网页中引用这个CSS文件。通过HTML的link元素将外部的样式链接到网页中。
2)导入样式表
在<style>标签内使用@import导入外部样式文件
Ps:自我感觉链接样式更清楚,样式和内容可以更好地归类。
三.选择符的分类
1.普通选择符
2.类选择符
HTML标记名上加上类名,如果想将<p>有两种样式,一个居中,一个居右,则可以写成p.center和
p.right
3.id选择符
HTML标记名上加上id名,中间用#号分开
综上 .类名——class属性
#id名——id属性
四.伪类及伪对象
1.超链接伪类
a:link——未被访问的链接
a:visited——已被访问的链接
a:hover——鼠标指针悬浮在其上的链接
a:active——鼠标点中激活链接
优先级关系:a:link>a:visited>a:hover>a:active 注意顺序书写
2.常用伪对象
:first-letter—设置对象内的第一个字符的样式表属性
:first-line—设置对象内的第一行的样式表属性
注意:如果是body:first-line则整个页面文字的第一行会变,如果是p:first-line则整全部文字会变
五.常见的DIV+CSS布局类型
首先,先清楚padding、border、margin所指范围
1.DIV
详细解剖:
2.一列固定
3.两列固定宽度
4.三列浮动中间宽度自适应
5.三行两列居中高度自适应
六.实践环节-页面布局
运行页面:
代码展示: