CSS概念
CSS是Cascading Style Sheets的简称，中文称为层叠样式表，用来控制网页数据的表现，可以使网页的表现与数据内容分离。属性和属性值用冒号隔开，以分号结尾。
一、CSS的四种引入方式
1.行内式
??? 行内式是在标签的style属性中设定CSS样式。这种方式没有体现出CSS的优势，不推荐使用。
<h1 style="color: red">CSS层叠样式表使用方法1</h1>
2.嵌入式
??? 嵌入式是将CSS样式集中写在网页的<head></head>标签对的<style></style>标签对中。格式如下：
<head> ???<meta charset="UTF-8"> ???<title>Title</title> ???<style> ???????p{ ???????????background-color: #2b99ff; ???????} ???</style></head>
3.链接式
??? 将一个.css文件引入到HTML文件中
<link rel="stylesheet" href="index.css" type="text/css"/>
4.导入式
??? 将一个独立的.css文件引入HTML文件中，导入式使用@import 引入外部CSS文件，<style>标记也是写在<head>标记中。
<head> ???... ???<style type="text/css"> ???????@import "My.css"; 此处注意.css文件的路径 ???</style></head>
注意： ???导入式会在整个网页装载完后再装载CSS文件，因此这就导致了一个问题，如果网页比较大则会儿出现先显示无样式的页面，闪烁一下之后，再出现网页的样式。 ???这是导入式固有的一个缺陷。使用链接式时与导入式不同的是它会以网页文件主体装载前装载CSS文件，因此显示出来的网页从一开始就是带样式的效果的，它 ???不会象导入式那样先显示无样式的网页，然后再显示有样式的网页，这是链接式的优点。
二、CSS的选择器
1.基本选择器
a.通用选择器 ???* 表示应用到所有的标签 ???* {color: yellow}b.标签选择器 ???匹配所有使用 div 标签的元素（可以匹配所有标签） ???div {color: yellow}c.类选择器 ???匹配所有class属性中包含info的元素。 ???语法：.类名{样式}（类名不能以数字开头，类名要区分大小写。） ???.Mycolor {color: yellow} ???<h3 class="Mycolor">nick</h3>d.ID选择器 ???使用id属性来调用样式，在一个网页中id的值都是唯一的（是W3C规范而不是规则，所以不会报错）。 ???语法：#ID名{样式}（ID名不能以数字开头） ???#Mycolor {color: yellow} ???<h3 id="Mycolor">Nick.</h3>
2.组合选择器
a.多元素选择器 ???同时匹配h3,h4标签，之间用逗号分隔。 ???h3,h4 {color: yellow;} ???<h3>Nick</h3> ???<h4>Jenny</h4>b.后代元素选择器 ???匹配所有div标签里嵌套的P标签，之间用空格分隔。 ???div p {color: yellow;} ???<div> ???????<p>Nick</p> ???????<div> ???????????<p>Nick</p> ???????</div> ???</div>c.子元素选择器 ???匹配所有div标签里嵌套的子P标签，之间用>分隔。 ???div > p {color: yellow;} ???<div> ???????<p>Nick</p> ???????<p>Nick</p> ???</div>d.毗邻元素选择器 ???匹配所有紧随div标签之后的同级标签P，之间用+分隔（只能匹配一个）。 ???div + p {color: yellow;} ???<div>Nick</div> ???<p>Nick</p>
CSS基础
原文地址：https://www.cnblogs.com/Felix-DoubleKing/p/10192420.html