简介
CSS,Cascading Style Sheets,层叠样式表
Cascading,层层叠起来的样式
Style,即文字大小、颜色、背景等等的表现
Sheets,即样式列表
CSS行内样式(内联样式)
在 HTML 标签的style属性内书写的 CSS,就是行内样式
<!-- style 属性,属性值为 name: value -->
<h1 style="name: value;"></h1>
CSS内部样式
将 CSS 统一书写在<head>中的<style>中
<head>
<style>
h1{
color: green;
font-size: 10px;
}
</style>
</head>
<body>
<h1>hello, world</h1>
</body>
CSS外部样式
在<head>中使用<link>引入外部 CSS 样式文件
- rel,relation
- href,referemce
<head>
<link rel="stylesheet" href="index.css">
</head>
<body>
<h1>hello, world</h1>
</body>
将样式统一写index.css文件中
h1{
color: green;
}
CSS样式表优先级
- 行内样式 > 内部样式
- 行内样式 > 外部样式
- 内部样式 = 外部样式
CSS语法规范
选择器 { 属性名: 属性值; }
CSS三大特性
层叠性
当多个样式规则作用于同一个 HTML 元素时,这些样式规则会根据优先级进行层叠,决定最终的样式表现
继承性
元素会继承父元素、祖先元素的部分样式;优先继承父元素
优先级
!important >> 行内样式 >> ID选择器 >> 类选择器 >> 元素选择器 >> 通配选择器 >> 继承性