CSS选择器

群组选择器
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge" >
<title>小兰兰</title>
<link rel="stylesheet" href="01.css">
<style>
div,p,#s1{color: #009966;background: violet;}把所有不同类别用逗号隔开一起修饰效果即可全部应用!
</style>
 
</head>
<body>
<div>dior</div>
<p>chanel</p>
<span id="s1">ysl</span>
<h4>SOD</h4>
</body>
 
 
伪类选择器-链接伪类选择器
style标签里代码如下 :
a:link{color:red;}被点击后的效果
a:visited{color:pink;}未被点击之前效果
伪类选择器-动态伪类选择器
a:active{font-style:italic;(字体样式:斜体)}激活之后效果/鼠标点住不放
input:focus{background:black;color:white;}匹配元素获取焦点时
img:hover{width:500px;}鼠标悬停时状态变换根据宽度大小而改变
 
此类伪选择器顺序为
a:link a:visited a:hover a:active

posted on 2019-11-05 14:37  咳咳1122  阅读(77)  评论(0编辑  收藏  举报

导航