跳转到主内容
极星编程网:以代码为星,赴技术山海!

CSS基本内容

一、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不受内嵌式控制,受外链式控制属性,所以外链式具有中等优先级,则内嵌式是最低优先级

相关文章