CSS基础-3.1为网页添加样式

为网页添加样式

术语解释

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

CSS规则（整条代码称为CSS规则） = 选择器 + 声明块

选择器

选择器：选中的元素,确定样式的范围，如花括号前面的h1

1. 元素选择器： 选中所有该元素

2. id选择器：选中的是对应id值的元素,选择范围窄

3. 类选择器（常用）：和选择的元素没有关系，只要其元素属性是类

声明块

声明块：出现在大括号里，其中包含了很多声明（属性），每一个声明（属性）都表明了某一方面的样式规则

CSS代码书写位置

1. 内部样式表

   代码书写在style元素里，通常将style代码放在head里面，想让浏览器最先加载出来样式，直接以妆发完整的出现在用户面前。

2. 内联样式表

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

3. 外部样式表[推荐]

   将样式书写到独立的css文件中，使用link元素将css文件与html代码文件链接起来：

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

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

css注释

ctrl+?： /* 这是一个css规则 */