本文详细介绍了如何使用CSS设置网页元素的样式，包括内部样式、外部样式、ID选择器、类选择器以及CSS文件的引用方法。同时，文章还讲解了样式的优先级问题。
如何设置样式？
1、内部样式：<div style=width:"200px"></div>
2、外部样式：（1）将style单独拿出来
<style>
div{width:"200px"}
</style>
以上代码表示对所有div都有效。
（2）若想要每个div的样式不同，可以用id来为div命名，用符号“#”来标注id，注意id是不可以重复的，两个元素的id是不同的，类比于人的身份证号，是唯一的。另外也要注意“见名知意”，在工程量较大的程序里，命名是非常重要的。
<style>
#box{width:"200px"}
</style>
<div id="box"></div>
（3）若两个或多个元素的样式相同，也可以用class，class用符号“.”标识，class可以重复。
<style>
.box{width:"200px"}
</style>
<div class="box"></div>
若两个元素之间有继承关系，样式可以写成以下形式：
<style>
.box .aaa{width:"200px"}（box和aaa之间有空格）
</style>
<div class="box">
<div class="aaa"></div>
</div>
若两个class的样式相同，可用逗号隔开：
<style>
.box,.aaa{width:"200px"}
</style>
3、css文件。将所有样式都写在css文件中，而不是写在主页面里。在主页面的head标签里添加css文件的相对路径：
<head>
<link rel="stylesheet" href="css/style.css"/>
</head>
若作用在同一个元素上的样式不冲突，则所有的样式都会显示；若发生冲突，就涉及到样式的优先级问题。
内部样式>外部样式的id>外部样式的class
在这三种样式之前，级别最高的是!important，这个符号只对一个样式有效，紧跟在此样式之后，分号之后的样式就不起作用了。
扫一扫
2534
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
