7、css基本选择器、层叠样式
1、css基本选择器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
/*#d1 {*/
/* color: greenyellow;*/
/*}*/
/* 类选择器*/
/* .c1{ 找到class里面所有包含c1的标签*/
/* color:red;*/
/* }*/
/* 元素选择器*/
/* span { 找到所有span标签*/
/* color:red;*/
/* }*/
/* * { 将html页面上的标签全部找到*/
/* color:green;*/
/* }*/
</style>
</head>
<body>
<div id="d1" class="c1 c2">
<p>div里面的p</p>
<span>div里面的span</span>
</div>
<p id="d2" class="c1 c2">ppp</p>
<span id="d3" class="c2">span111</span>
<span id="d4" class="c3">span222</span>
</body>
</html>
2、css层叠样式表
/*单行注释*/
/*
多行注释
*/
通常在写css样式的时候会用注释划定区域
css的三种引入方式
1、style标签内部直接书写
<style>
h1 {
color:burlywood;
}
</style>
2、link标签引入外部css文件（最正规的方式、解耦合）
<link rel="stylesheet" href="mycss.css>
3、行内式(一般不用)
<h1 style="color:green">老板好，要妹纸吗<h1>
css的学习流程
1、先学如何查找
css查找标签的方式
后面所有框架封装的查找语句都是基于css来的
css选择器
基本选择器
id选择器
类选择器
元素/标签选择器
通用选择器
组合选择器
div span 后代选择器 拿所有层级
div>span 二子选择器 只拿第一层级
div+span 毗邻选择器 同级别紧挨着的下面第一个
div~span 同级别下面所有的span
属性选择器
1、含有某个属性
2、含有某个属性 并且有某个值
3、含有某个属性并且有某个值某个标签
ps属性选择器是以 []起手作为标志 的
