标签：:active 属性选择器 默认 arc ack big some html http
/*单行注释*/
/*
多行注释1
多行注释2
多行注释3
*/<link rel="stylesheet" href="test.css"><head>
<style>
h1 {
color: red;
}
</style>
</head><h1 style="color: red">bigb</h1>标签选择器
id选择器
类选择器
通用选择器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>基本选择器</title>
<style>
span {
color: darkred;
}
#d1 {
color: darkgreen;
}
.c1 {
color: darkblue;
}
* {
color: darkgoldenrod; /*会覆盖上面的样式*/
}
</style>
</head>
<body>
<span>这是一个span标签</span>
<div id="d1">这是一个div标签</div>
<p class="c1">这是一个p标签</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>组合选择器</title>
<style>
div span {
color: darkred;
}
</style>
</head>
<body>
<div>这是一个div标签1
<span>这是一个在div标签1中的span标签1</span>
<span>这是一个在div标签1中的span标签2</span>
<p>
<span>这是一个在div1下面的p标签中的span标签</span>
</p>
<span>这是一个在div标签1中的span标签3</span>
</div>
<span>这是div后面的span标签1</span>
<p>这是一个p标签</p>
<span>这是div后面的span标签2</span>
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>属性选择器</title>
<style>
/**[username] {*/
/*color: darkred;*/
/*}*/
*[username="bigb"] {
color: darkred;
}
</style>
</head>
<body>
<p username="bigb">p标签1</p>
<p username="blake">p标签2</p>
<p username="black">p标签3</p>
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>伪类</title>
<style>
a:link {color: red;} /*未访问的连接*/
a:visited {color: darkgrey;} /*已访问的连接*/
a:hover {color: darkgreen;} /*鼠标悬浮在连接上*/
a:active {color: darkblue} /*点击连接*/
</style>
</head>
<body>
<a href="https://baidu.com">click here to search</a>
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>伪元素</title>
<style>
p:first-letter {
font-size: 40px;
color: darkred;
}
p:before {
content: "***";
color: darkgreen;
}
p:after {
content: "???";
color: darkgreen;
}
</style>
</head>
<body>
<p>sometime I rock sometime I roll sometime it's not me is control.</p>
</body>
</html>标签：:active 属性选择器 默认 arc ack big some html http
原文地址：https://www.cnblogs.com/bigb/p/11853404.html
