基础选择器和综合选择器实例
来源:互联网 发布:python 金融工程 编辑:程序博客网 时间:2024/05/22 09:05
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
b{
color: blue;
}
#test{
color: red;
}
.test1{
color: green;
}
div .abc{
color: pink;
font-size: 50px;
}
div span{
font-size: 50px;
}
.xuanze span{
color: green;
text-decoration: underline;
}
.love>span{
color: red;
font-size: 50px;
}
div.tong,p{
color: blue;
font-size: 100px;
}
/*选择第一个目标元素*/
ul li:first-child {
color: red;
font-size: 50px;
}
/*选择最后一个目标元素*/
ul li:last-child {
color: blue;
font-size: 50px;
}
.qwd+{
color:red;
font-size: 50px;
}
</style>
</head>
<body>
<b>Html选择器</b>
<div class="test1">class选择器</div>
<div id="test">id选择器</div>
<div>
<em class="abc">aabbcc</em>
</div>
<div class="xuanze">
<span>第一层选择</span>
<div>
<span>第二层选择</span>
<div>
<span>第三层选择</span>
</div>
</div>
</div>
<div>
<span>first</span>
<div class="love">
<span>second</span>
<div>
<span>third</span>
</div>
</div>
</div>
<div class="tong">痛苦的一匹</div>
<p>痛苦的一pi</p>
<ul>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
<li>ddd</li>
</ul>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
b{
color: blue;
}
#test{
color: red;
}
.test1{
color: green;
}
div .abc{
color: pink;
font-size: 50px;
}
div span{
font-size: 50px;
}
.xuanze span{
color: green;
text-decoration: underline;
}
.love>span{
color: red;
font-size: 50px;
}
div.tong,p{
color: blue;
font-size: 100px;
}
/*选择第一个目标元素*/
ul li:first-child {
color: red;
font-size: 50px;
}
/*选择最后一个目标元素*/
ul li:last-child {
color: blue;
font-size: 50px;
}
.qwd+{
color:red;
font-size: 50px;
}
</style>
</head>
<body>
<b>Html选择器</b>
<div class="test1">class选择器</div>
<div id="test">id选择器</div>
<div>
<em class="abc">aabbcc</em>
</div>
<div class="xuanze">
<span>第一层选择</span>
<div>
<span>第二层选择</span>
<div>
<span>第三层选择</span>
</div>
</div>
</div>
<div>
<span>first</span>
<div class="love">
<span>second</span>
<div>
<span>third</span>
</div>
</div>
</div>
<div class="tong">痛苦的一匹</div>
<p>痛苦的一pi</p>
<ul>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
<li>ddd</li>
</ul>
</body>
</html>
阅读全文
0 0
- 基础选择器和综合选择器实例
- jQuery选择器-综合案例
- css--1.基础和选择器
- css基础属性和选择器
- CSS3后代选择器和同级选择器简介和实例
- 基础选择器
- 选择器基础
- 选择器和复杂选择器
- jQuery基础----02jQuery选择器和事件-选择器
- css选择器标签选择器和id选择器
- 04-CSS 选择器(基础选择器、高级选择器) CSS 的继承性和层叠性
- 深入学习jQuery选择器系列第一篇——基础选择器和层级选择器
- CSS基础:基本选择器分类和使用
- jQuery日记(1)--jQuery基础和选择器
- 1.css基础和选择器的介绍
- css基础选择器和盒模型
- 选择器
- 选择器
- servlet中的PrintWriter out = response.getWriter()显示的乱码问题
- FrameworkServlet
- spring+定时器配置
- 反应式编程(Reactive Programming)
- C++访问MYSQL数据库
- 基础选择器和综合选择器实例
- 获取手机信息工具le
- Java后台之路(16)-代理、反射等
- 发布Library到JCenter,步步为营
- 翻转二叉树
- js中json字符串和json对象相互转化
- mysqlcluster查看内存使用情况和表空间
- 用Python输出九九乘法表
- jdbc往数据库里更新或插入字符串出现Unknow column ‘d’ ‘in Field list’