CSS（一）

CSS

1，CSS简介

CSS最大价值：由HTML专注做结构呈现，样式交给CSS，即结构（HTML）与样式（CSS）相分离。

1.1.css语法规范

CSS规则由两个主要的部分构成：选择器以及一条或多条声明。

选择器是指用于指定CSS样式的HTML标签，花括号内是对该对象设置的具体样式。

1.2，css代码风格

①,样式格式书写

推荐第二种

②,样式大小写风格

推荐样式选择器，属性名，属性关键字全部使用小写字母，特殊情况除外。

③,样式空格风格

1，属性值前面，冒号后面，保留一个空格。
2，选择器（标签）和大括号中间保留空格。

2，CSS基础选择器

2.1 CSS选择器的作用

选择器（选择符）就是根据不同需求把不同的标签选出来。简单来说，就是选择标签。

2.2 选择器的分类

选择器分为基础选择器和复合选择器

基础选择器由单个选择器组成。

基础选择器又包括：标签选择器，类选择器，id选择器和通配符选择器

2.2.1 基础选择器_标签选择器

标签选择器（元素选择器）是指用HTML标签名称作为选择器，按标签名称分类，为页面中某一类标签指定统一的CSS样式。
语法：

标签名 {
       属性1 :  属性值1;
       属性2 :  属性值2;
       属性3 :  属性值3;
       ...
}

作用

标签选择器可以把某一类标签全部选择出来，比如所有的<div>标签和所有的<span>标签

2.2.2 基础选择器_类选择器

如果要差异化选择不同的标签，单独选一个或者某几个标签，可以使用类选择器
语法：

.类名{
     属性1: 属性值1;
     ...
 }

类选择器-多类名

给一个标签指定多个类名。

2.2.3 基础选择器_id选择器

语法：

#id名{
    属性1: 属性值1;
    ...
}

注意：id属性只能在每一个HTML文档中出现一次。

2.2.4 基础选择器_通配符选择器

在CSS中，通配符选择器使用“*”定义，它表示选取页面中的所有元素（标签）。
语法：

* {
   属性1: 属性值1；
   ...
   }

3，CSS字体属性

CSS Fonts（字体）属性用于定义字体系列，大小，粗细，和文字样式（如斜体）。

3.1 字体系列

p { font-family:"微软雅黑"；｝
div {font-family: Arial,"Microsoft Yahei","微软雅黑";}

3.2 字体大小

p {
        font-size: 20px;
}

3.3 字体粗细

font-weight

3.4 字体样式

font-style

4，CSS文本属性

对齐文本：text-align
装饰文本：text-decoration（下划线，删除线，上划线等）
文本缩进：text-indent（段落的首行缩进）
行间距：line-height（行间距组成：上间距，下间距，文本高度（或者：文本高度+两行之间的空白。））

5，CSS的引入方式

按照CSS样式书写的位置（或者引入的位置），CSS样式表可以分为三大类：

1，行内样式表（行内式）

行内样式表是在元素标签内部的style属性中1设定CSS样式，适用于简单样式。
2，内部样式表（嵌入式）

内部样式表是写到HTML页面内部，是将所有的CSS代码抽离出来，单独放到一个<style>标签中。
3，外部样式表（链接式）

实际开发中都是外部样式表。适用于样式比较多的情况，核心是：样式单独写到CSS文件中，之后把CSS文件引入到HTML页面中。

1，新建一个点缀为.css的样式文件
2，在HTML页面中，使用<link>标签引入这个文件
<link rel="stylesheet" href="cssz文件路径">