css案例学习之继承关系
代码
<html>
<head>
<title>继承关系</title>
<style>
body{
color:blue; /* 颜色 */
text-decoration:underline; /* 下划线 */
}
em{
color:red; /* 颜色 */
}
</style> </head>
<body>
<h1><em>前沿</em>教室</h1>
<p>欢迎来到前沿教室，这里为您提供丰富学习内容。</p>
<ul>
<li>在这里，你可以学习到：
<ul>
<li>HTML</li>
<li>CSS
<ul class="css">
<li>CSS初级</li>
<li>CSS中级</li>
<li>CSS高级</li>
</ul>
</li>
<li>Javascript</li>
</ul>
</li>
<li>你还可以学习到：
<ol>
<li>Flash</li>
<li>Dreamweaver</li>
<li>Photoshop</li>
</ol>
</li>
</ul>
<p>如果您有任何问题，欢迎联系我们</p>
</body>
</html>
说明：body下面的元素都继承了body的属性。然后em中的颜色属性又会被覆盖掉。
后代选择器
代码
<html>
<head>
<title>继承关系</title>
<style>
h1{
color:blue; /* 颜色 */
text-decoration:underline; /* 下划线 */
}
em{
color:red; /* 颜色 */
}
li li{
color:green ;
font-weight:bold;
} </style> </head>
<body>
<h1><em>前沿</em>教室</h1>
<p>欢迎来到前沿教室，这里为您提供丰富学习内容。</p>
<ul>
<li>在这里，你可以学习到：
<ul>
<li>HTML</li>
<li>CSS
<ul>
<li>CSS初级</li>
<li>CSS中级</li>
<li>CSS高级</li>
</ul>
</li>
<li>Javascript</li>
</ul>
</li>
<li>你还可以学习到：
<ol>
<li>Flash</li>
<li>Dreamweaver</li>
<li>Photoshop</li>
</ol>
</li>
</ul>
<p>如果您有任何问题，欢迎联系我们</p>
</body>
</html>
说明：li 下面的li会被添加绿色属性 包括孙子，曾孙子
css案例学习之继承关系的更多相关文章
- css案例学习之table tr th td ul li实现日历
效果 代码 <html> <head> <title>Calendar</title> <style> <!-- .month { b ...
- css案例学习之盒子模型
定义:每个盒子都有:边界.边框.填充.内容四个属性: 每个属性都包括四个部分:上.右.下.左:这四部分可同时设置,也可分别设置:里的抗震辅料厚度,而边框有大小和颜色之分,我们又可以理解为生活中所见盒子 ...
- css案例学习之全局声明*{} 与body{}的区别
代码 <html> <head> <title>全局声明</title> <style type="text/css"> ...
- CSS 案例学习
1.样式 display:inline-block;可改变a标签,合其可定义宽高 2.a:hover表示鼠标经过 3.background:url(110.png) bottom 表示:给链接一个图片 ...
- css案例学习之用thead、tbody、tfoot实现漂亮的table布局
首先说说thead.tbody.tfoot <thead> <tbody> <tfoot> 无论前后顺序如何改变, <thead> 内的元素总是在表的最 ...
- css案例学习之ul li dl dt dd实现二级菜单
效果 代码实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...
- css案例学习之按钮超链接
效果 css实现 <html> <head> <title>按钮超链接</title> <style> a{ /* 统一设置所有样式 */ ...
- css案例学习之relative与absolute
代码 <!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o ...
- css案例学习之float浮动
代码: <!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...
随机推荐
- Moodle的qq登录版块的使用
在这篇Moodle的qq登录(QQ登陆)版块的使用教程中,我们假定你已经有了一个有域名,外网能访问的Moodle2.4+网站,并且数据库使用的是mysql. 我们将提供Moodle的QQ登录版块的下载 ...
- SQL Server 查看当前活动的锁
第一步: 要查看活动中的锁,如果日前根本就没有活动中的锁怎么办,还好我会自己做一把. begin tran select * from dbo.Nums with(ta ...
- 在类似qq或者微信聊天中。如何根据不同的手机发送图片
原文:在类似qq或者微信聊天中.如何根据不同的手机发送图片 前一段时间,公司自己要求做多客服开发,但是对于发送图片这一块,当时很苦恼,我用自己的手机(米2)测试,不管是本地,还是云相册,最新照片. ...
- OC中NSString 的常用方法
NSString *str1 = @"BeiJing"; NSString *str2 = @"beijing"; //全部转为大写 NSLog(@" ...
- 【位运算DFS/DLX】【HDU1426】【数独】
题意:标准的一道数独题 DFS做法: 将横纵九宫格里的数字用位运算状态压缩,且可以通过逻辑或来确定总共有哪些数字被选择了,很方便也很快,代码如下 #include <cstdio> #in ...
- SOA架构有基本的要求
SOA在相对较粗的粒度上对应用服务或业务模块进行封装与重用: 服务间保持松散耦合,基于开放的标准, 服务的接口描述与具体实现无关: 灵活的架构 -服务的实现细节,服务的位置乃至服务请求的底层协议都应该 ...
- Windows 2012 AD配置
//本文选在快帮网,非原创. Active Directory概述: 使用 Active Directory(R) 域服务 (AD DS) 服务器角色,可以创建用于用户和资源管理的可伸缩.安全及可管理 ...
- JqueryUI-3
本文在于巩固基础 JqueryUI控件之滚动条 这次主要是看Jquery官网上的API文档来做的 <!DOCTYPE html> <html> <head lang=&q ...
- asp.net文件下载
protected void btn_Down(object sender, EventArgs e) { string filePath = Server.MapPath("/TradeL ...
- Broadcast详解
今天闲来无事,研究了下Android的Broadcast,发现Broadcast在Android系统中担任着很艰巨的角色. Broadcast是Android的四大组件之一:Broadcast分为普通 ...