CSS_选择器

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS选择器</title>
<style >
/*2.类选择器:选择class等于某值的所有元素.class是程序员根据逻辑自己给元素增加的分类 */
.man{
color: pink;
}
/*3.id选择器:选择id等于某值的唯一的元素 */
#p4{
color: yellow;
}
/*4.选择器组:写出一组选择器,选中每个选择器所对应的目标的并集 */
.man,#p4{
font-weight: bold;
}
/*5.派生选择器 */
/* 5.1 选择某元素的子孙 */
#p5 b{
color: red;
}
/*5.1 选择某元素的儿子 */
#p5>b{
font-size: 30px;
}
/*6.伪类选择器:根据元素的状态选择元素 */
/*6.1 选择未访问的超链接 */
a:link{
color: green;
}
/*6.2选择已访问的超链接 */
a:visited{
color: red;
}
/*6.3 选择激活态的按钮 */
#i1:active {
background-color: blue;
}
/*6.4 选择有焦点的文本框、密码框、文本域*/
#i2:focus{
background-color:green;
}
/*6.5选择鼠标悬停态(触碰)的图片*/
img:HOVER {
width: 350px;
height: 350px;
}
</style>
</head>
<body>
<p class="man">唐僧师徒四人</p>
<p >孙悟空师徒四人</p>
<p class="man">猪八戒师徒四人</p>
<p id="p4">沙僧师徒四人</p>

<p id="p5">
温州市<u>平阳县<b>鳌江镇</b></u>经济<b>开发区</b>B幢5号;

</p>
<p>
<a href="https://www.baidu.com">百度</a>
<a href="https://home.cnblogs.com/blog/">博客园</a>
<a href="https://home.cnblogs.com">测试</a>


</p>
<p>
<input type="button" value="按钮" id="i1">
</p>
<p>
<input type="text" id="i2">

</p>
<p>
<img alt="" src="../images/01.jpg">
</p>

</body>
</html>

转载于:https://www.cnblogs.com/Bighua123/p/7581057.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值