【CSS学习记录-1】：CSS基本概念

一，CSS概述：

        （1）CSS（层叠样式表）：主要用于页面布局，包括文本内容，图片外形以及版面布局

        （2）设计时，让HTML专注于结构，CSS专注于样式

        （3）CSS组成：

选择器{
    键：值;        #样式
}

二，CSS引入

        （1）内部样式表：使用专门的<style>标签，<style> css </style>。一般放于head处，控制一个页面

        （2）行内样式表：直接定义在标签内，<......,style='key:value'....>

        （3）外部样式表：定义一个css文件，通过link引入（使用最多）

<link rel = 'stylesheet' , href = css路径 >

三，CSS三大特性

<建议看完后边再倒回来>

        （1）层叠性：样式取并集，冲突部分覆盖

        （2）继承性：子标签会继承父标签的某些特性，同时也会覆盖父标签的某些特性。

        （3）优先级：当多个选择器选择同一个标签时，优先考虑权重大的标签

                ① 优先级顺序：范围越小，权重越大

>>>>>>>> ！important > style > ID > 类 > 元素 > 继承，*    
例：
{color:red !important;}
>>>>>>>> 对于复合选择器：权重叠加得到最后的权重

四，Emmet语法   

        【作用】：  基于tab键自动补全机制，快速编写HTML/CSS代码

        1，快速生成HTML代码

                （1）多个标签： div * n                        <Tab>

                （2）父子关系：div > p                        <Tab>

                （3）兄弟关系：div + p                        <Tab>

                （4）类名生成：div.class                        <Tab>

                        【div.class$*n                生成div.class1~div.classn】

                （5）ID生成：div#id                        <Tab>                   

                （6）生成带文本的lable：{文字}

        2，快速生成CSS代码

                （1）方法：使用首字母缩写即可

                                text-aligh: center                【缩写】                tac<Tab>

                                text-indent: 20em                【缩写】                ti2e<Tab>

        3，格式化代码

                （1）方法一：右键→格式化

                （2）方法二：快捷键Shift+Alt+F

                （3）方法三：更改配置文件，直接使用ctrl+s即可格式化