CSS概念及入门
简介
CSS 的全称为：层叠样式表 ( Cascading Style Sheets ) 。
CSS 也是一种标记语言，用于给 HTML 结构设置样式，例如：文字大小、颜色、元素宽高等等。
主流的布局方式:div+css。
组成
选择器
用于选择页面中的元素,进行样式的控制。
属性
用于设置样式,布局控制。
区别
css和html属性控制样式的区别：
- css控制样式更加的专业，可以实现html属性实现不了的效果。
- 可以实现标签和样式的分离，提高样式的重用性，提高开发效率。
CSS引入方式
行内样式
语法
写在HTML标签的style属性里的，规范是“名:值”，语法如下：
特点
- 简单，耦合性强，但是不利于代码和样式的分离，没有复用性。
- 样式可以写在标签内部，但不推荐，因为优先级太高。
内部样式
写在html里面的任意位置，一般写在<head>里面。
语法
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>CSS初体验</title><style>h1 {/* 样式可以直接写在html中，这样可以控制整个页面的样式 *//* 设置宽度 */width: 50px;/* 设置高度 */height: 50px;/* 文字对齐 */text-align: center;}</style></head><body><h1 style="color: #ffffff">Hello World</h1></body>
</html>特点
- 实现了html代码和样式的分离，只能在当前页面进行复用。
- 这种写法代码结构清晰，样式可以为多个标签复用，但是并没有实现样式与结构完全分离。
外部样式
写在**.css**文件里的样式，然后在HTML文件里引用，语法如下：
-
在该文件目录创建一个**.css**后缀的文件
-
在html文件进行引用
- href文档路径：引入的文档来自哪里
- rel关系：引入文档和当前文档的关系
特点
在实际开发中，我们用得最多的就是这种书写位置，引入外部样式，可以更好地将结构与样式分离。
三种引入优先级
优先级规则：行内样式 > 内部样式 = 外部样式
内部样式和外部样式优先级一样，如果同时使用，后面的会覆盖前面的（简记：“后来者居上”）。
