标签：ref pen char 嵌套 data http develop vbr header
CSS（Cascading Style Sheet，层叠样式表)定义如何显示HTML元素。
当浏览器读到一个样式表，它就会按照这个样式表来对文档进行格式化（渲染）。
每个CSS样式由两个组成部分：选择器和声明。声明又包括属性和属性值。每个声明之后用分号结束。
<span style="color:red;">行内样式</span>
<head> <meta charset="UTF-8"> <title>Title</title> <style> p{ color: red; } </style> </head> <body> <p>内部样式</p> </body>
<link href="css文件目录" rel="stylesheet" type="text/css"/>
p{color:red;}
#a{color:red;}
.a{color:red;}
*{color:red}
选中div内部所有p标签 span a{color:red;}
选择的是父级div元素中所有p元素
div>p{color:red;}
选择的是紧接着div元素后的p元素
div+p{}
选择的是li后面的所有兄弟p标签
li~p{}
/*用于选取带有指定属性的元素。*/ p[title] { color: red; } /*用于选取带有指定属性和值的元素。*/ p[title="213"] { color: green; }
多个元素的一起设置样式
div, p { color: red; }
多种选择器一起设置样式
.c1 p { color: red; }
/* 未访问的链接 */ a:link { color: red } /* 鼠标移动到链接上 */ a:hover { color: green } /* 选定的链接 */ a:active { color: blue } /* 已访问的链接 */ a:visited { color: black } /*input输入框获取焦点时样式*/ input:focus { outline: none; background-color: #eee; }
常用的给首字母设置特殊样式： p:first-letter { font-size: 48px; color: red; } before在每个<p>元素之前插入内容 p:before { content:"*"; color:red; } after在每个<p>元素之后插入内容 p:after { content:"[?]"; color:blue; }
内联样式>id选择器>类选择器>元素选择器
标签：ref pen char 嵌套 data http develop vbr header
原文地址：https://www.cnblogs.com/lulingjie/p/11657384.html
