一、CSS的定义 层叠样式表(Cascading Style Sheets)是给HTML标签添加样式的语言,可以设置HTML页面中文字大小、颜色以及元素的位置等样式。
二、CSS的意义 实现内容与样式分离,便于后期的维护以及样式的重复使用。
三、CSS的应用方式 1.行内式 样式写在元素上的style属性中 最有最高优先级 运行代码如下:
测试css引用方式:行内式
运行结果如下:
2.内嵌式 与HTML的内容和结构标签分开来,内嵌在HTML文件中 最有中等最低级 运行代码如下:
内嵌式
测试css引用方式:内嵌式
运行结果如下:
3.外链式 通过HTML页面添加链接标签的方式生效 可被多个网页甚至整个网站所有网页运用 具有中等优先级 (1)< link >标签
标签必须放在页面的< head >...< /head >标签对内,语法格式为
注: CSS文件外链尽可能使用 相对路径 ,以提高代码移植性 首先新建文件 ”1.style.css“(要规范命名,一般命名为 style 或 css) 运行代码如下:
基本内容
测试css引用方式:外链式
1.style.css 文件的运行代码如下:
h4{
color: blue;
font-size: 30px;
font-family: 宋体;
}
运行结果如下:
4.优先级 CSS方式优先级:行内式、外链式、内嵌式 ,根据“后来居上”原则 (1)行内式:最高优先级 运行代码如下:
基本内容
行内式:最高优先级
1.style.css 文件的运行代码如下:
h2{
color: blue;
font-size: 30px;
font-family: 宋体;
}
运行结果如下:
结论: 依旧是以行内式的属性优先 (2)外链式: 中等优先级 运行代码如下:
基本内容
外链式:中等优先级
1.style.css 文件的运行代码如下:
h4{
color: blue;
font-size: 30px;
font-family: 宋体;
}
运行结果如下:
结论: h4不受内嵌式控制,受外链式控制属性,所以外链式具有中等优先级,则内嵌式是最低优先级
