CSS基础（1）- 为网页添加样式

本系列笔记是基于【渡一教育】袁进老师的html+css基础课程而记录，仅作为个人记录以及阅读使用。

为网页添加样式

术语解释

h1 {
        background-color: lightblue;
        color: red;
        text-align: center;
    }

css规则 = 选择器 + 声明块

选择器

选择器：选中元素

1. ID选择器
2. 元素选择器
3. 类选择器

声明块

出现在大括号里

声明块中包含很多声明（属性），每一个声明（属性）表达了某一方面的样式

css代码书写位置

1. 内部样式表 （推荐）

书写在style【元素】中

<style>
    ...
</style>

2. 内联样式表

直接书写在元素的style【属性】中

<p style="...">...</p>

3. 外部样式表（推荐）

把样式写到css文件，再引入

<link rel="stylesheet" href="./css/style.css">

1）外部样式表可以解决多页面样式重复的问题
2）有利于浏览器缓存，从而提高页面响应速度
3）有利于代码分离（HTML、css），更容易阅读和维护

参考资料

1. 【渡一教育】袁进老师的html+css基础课程
2. 【渡一教育】袁进老师相关课程源代码