首页 > 电脑主机 >

CSS继承

电脑杂谈　发布时间：2020-07-02 20:14:12　来源：网络整理

css清除样式_css样式继承_css 清除继承样式

什么是CSS继承功能

这里DIV CSS继承意味着我们设置了上级（父级）的CSS样式，并且下面的上级（父级）和子级（下级）具有此属性.

css清除样式_css样式继承_css 清除继承样式

通常，只有文本具有继承的特征，例如文本大小，文本粗体，文本颜色，字体等.

<!DOCTYPE html> 
<head> 
<meta http-equiv="Content-Type" 
 content="text/html; charset=utf-8" /> 
<title>CSS 继承特性 - www.divcss5.com</title> 
<style type="text/css"> 
.yangshi{width:400px; color:#F00;} 
.ziji{ float:left; width:300px;} 
</style> 
</head> 
<body> 
<div class="yangshi"> 
<div class="ziji">我是子级，我上级是yangshi</div> 
</div> 
</body> 
</html>

DIV+CSS继承实例图

css 清除继承样式_css清除样式_css样式继承

说明: 我将父级（父级: yangshi）的文本颜色设置为红色，而子级（ziji）未设置文本颜色，但是该文本具有继承特征，因此子级文本的内容仍然是红色.

如果设置了父级文字样式，则其某些子级可能与父级的颜色不同. 在这种情况下，您只需要为相应的子项设置所需的颜色即可.

演示如下:

css 清除继承样式_css清除样式_css样式继承

<!DOCTYPE html> 
<head> 
<meta http-equiv="Content-Type"
 content="text/html; charset=utf-8" /> 
<title>DIV CSS继承特性 - www.divcss5.com</title> 
<style type="text/css"> 
.yangshi{width:400px; color:#F00;} 
.ziji{width:300px;} 
.ziji2{ width:300px; color:#000;} 
</style> 
</head> 
<body> 
<div class="yangshi"> 
<div class="ziji">我是子级，我上级是yangshi</div> 
<div class="ziji2">我是子级2，我设置文字颜色为黑色</div> 
</div> 
</body> 
</html>