本文深入探讨了HTML和CSS在构建现代网页设计中的核心作用，从元素选择器到类选择器，详细解释了如何通过CSS样式来定制HTML元素的外观，包括颜色、布局和交互效果。通过实例演示了不同选择器的应用场景，帮助开发者实现更高效、更具创意的网页设计。
选择符号：E { sRules } 类型，直接选择器。E是元素的表示。
[]里面的是属性选择器：
E [ attr ] { sRules } 一个元素，有attr属性的
E [ attr = value ] { sRules }
·E1 E2 { sRules } 包含， E1的子元素和E2都使用这个样式，
<style type="text/css">
div button{ 所有div里面的button都变颜色
background:red;
}
</style>
</head>
<body>
<div id="div1">
hello
<button>
大家好
</button>
<p>
<button>哥们</button>
</p>
</div>
·E1 > E2 { sRules } 只选择e1的子元素：
<style type="text/css">
div>button{
background:red;
}
</style>
</head>
<body>
<div id="div1">
hello
<button>
大家好
</button>
·E.className { sRules }
1： .calssName {...} 所有的元素，都可以使用这个样式表。
2： E.className{...} 只有E这个元素，使用这个样式 表才有效。
div.abc{ div下的class="abc"的可以使用
background:red;
}
·E1 , E2 , E3 { sRules } 对E1,E2,E3,都使用同一个样式表,逗号间隔，平级的
div.abc,button,p,hr,#div1{ 都是平级的，都使用这个样式表
background:red;
}
div下的样式表使用abc的button使用
div.abc button{
background:red;
}
扫一扫
1810
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
