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案例学习之继承关系相关推荐

html并集选择器怎么写,css案例学习之并集选择器
代码并集选择器 h1, h2, h3, h4, h5, p{ /*并集选择器*/ color:purple; /* 文字颜色 */ font-size:15px; /* 字体大小 */ } h2.s ...
Java学习，继承关系的学习和理解
/* 将学生和工人的共性提取出来,单独进行描述. 只要让学生和工人与单独描述的这个类有关系,就可以了. 继承: 1,提高了代码的复用性. 2,让类与类之间产生了关系,有了这个关系,才有了多肽的特性. ...
css案例学习之全局声明*{} 与body{}的区别
代码 <html> <head> <title>全局声明</title> <style type="text/css"> ...
css案例学习之div与span的区别
代码: <html> <head> <title>div 标记范例</title> <style type="text/css" ...
css案例学习之relative与absolute
代码 <!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.or ...
css案例学习之按钮超链接
效果 css实现 <html> <head> <title>按钮超链接</title> <style>a{ /* 统一设置所有样式 */fo ...
css案例学习之id要唯一
ID有两个的后果 <html> <head> <title>ID选择器</title> <style type="text/css&qu ...
css案例学习之并集选择器
代码 <html> <head> <title>并集选择器</title> <style type="text/css"> ...
SQL案例学习-微博好友关系
微博中的用户关系需要使用有向图(Directed Graph)表示. 因为关注是单向关联,A关注了B,但是B不一定关注A.下图是一个简单的粉丝关系示意图: 如果A关注了B,就会存在一条从A到B的带箭头 ...

css案例学习之继承关系

css案例学习之继承关系相关推荐

最新文章

热门文章