内联样式
在CSS里，哪个样式规则能用到元素身上全看选择器的厉害程度。而老大哥级别的就是内联样式！内联样式就是直接往HTML元素的style属性里塞进去的那种，它跟元素关系最铁，所以优先级也自然高人一等。用这种方式，可以给任何特定的HTML元素打扮出你喜欢的样子，完全不需要靠别人。比如想让某个段落文字变成红色，就可以这么干：
内容
`来实现。
内联样式为啥最牛？就是因为它能直截了当地改变HTML元素的外观，而且马上见效！其他选器制定的规矩再多也白搭，有内联样式的地方就是老大！这让我们临时调整某些元素样式变得超简单超级棒的~
别忘了，编写代码时，尽管内联样式有优势，但是它也可能让你的HTML文件变得太乱，难以维护喔！所以，咱还是提醒大家，用内联样式时要节制，多试试别的选器来编辑吧～
ID选择器
在 CSS 里，我们可以用 id 选择器来挑选有固定 id 的 HTML 元素！咱们知道每个元素都能设定一个独一无二的 id，靠着这个特性就能给他们定制专属的样式。而且，id 选择器的地位可是非常高的，它在 CSS 里是用`#`作为前缀的。举个例子，比如你在 HTML 里设定了 id 为”header”的 div 元素，那么相应的 CSS id 选择器就应该写成`#header { color: blue;}`。这样一来，蓝色的字就在标题区域显现出来。
因为ID选择器只针对一个元素，所以它比其他两种选择器更牛逼。在做网页时，如果有那种就出现那么一回儿、还得特别点装扮的元素，那就用ID选择器。这样，就能迅速又准确地把那个特别的元素搞出个性。
，其实ID选择器是好使且快的那一种，可以很快找到要设置样式的元素，但是别太过分了，以免让你的CSS变得混乱不堪，不好维护。所以，我们在使用ID选择器时要考虑实际情况，不能随便乱用
类选择器
这是红色文本。
让我给你们说说CSS中的类选择器。啥叫类选择器？简单来说就是用HTML元素的class属性去选择多个对象，然后统一给他们安排好看点的风格设定。表达这种操作的符号就是「.」！举个例子，你对HTML里面的“按钮”这个东西，加上一个”btn”作为它的个性标签，那么对应的CSS类选择器就应该是这样的：`.btn {background-color: red;}`就是说把所有含有’btn’这个类名的元素的背景色都改成红色！
跟id选择器比起来，类选择器的优先级就低了。因为class属性本来就能放到好几个地方，而且一个元素有时候还能有多个名字！所以在做网页开发时，我们往往会用它来给一群相同风格或者功能差不多的元素添上点儿样式。在使用类选择器时，注意让它们明确点、好用点，这样代码就能重复利用，也便于维护！
在弄CSS时，可以把那些看着像一家人、功能差不多的元素归到一个类里，然后用这个类来管理他们的样子。这样做不仅让代码变得简洁有序、可重复利用，而且也减少了维修和开发的难度，省心！
元素选择器
元素选择器就是CSS里最基本又最常用的那一种，既能用来布局又能美化网页。用它找相应标签的HTML元素再套上相同或类似的样式就可以了。比如，利用CSS的p标签来选元素：`p{ font-size: 16px;}`。
比起ID和类选择器，元素选择器的优势在于可以一次性搞定所有符合条件的html元素，但是有个小问题就是不能只改变其中一个特殊元素的样式，所以大家还是要谨慎用它了！
其实，咱们在平时编程时，就能把那些通用、全局都能用上，又不需要特别处理的样式规则放到底部元素选择符号那块儿去。然后搭配其他更高级别的选择符，比如ID呀、class等等，这样就能写出便于理解，好维护和添加扩展的CSS代码了。
#my-element {
color: blue;
}通配符选择器
通配符(*号)在CSS里可是个厉害角色，它能在文档里找到任何类型的元素(包括任何层次上的节点啦)!可是，它一旦用上了就是最后的选择了，其他所有设置都会被它盖过哦!
通配符嘞，其实就是本来是最低级别的方式，可是有时候会无意或者不明原因地干扰到页面其他的地方！
例如：
*{
margin:0;
padding:0;
.my-class {
color: green;
}}
尽管通配符功能挺强，能让你快速搞全站的样式调优，不过由于它范围太广，而且优先级不高，所以做项目时可别乱用。
别狂用通配符，不然容易出乱子也会让网页变得慢得像蜗牛。
别用通配符乱调样式，有需要的话可以考虑跟其他精准的选择方法搭配着来。
总的来说，学会怎么运用多种不同的方法和组合方式去搞定DOM对象的展示和互动，可以帮你更轻松快速地解决问题。
总结
这篇文章详细解释和研究了怎么用CSS的各种方法来弄出好看又好用的DOM对象。
值得注意到：
p {
color: black;
}1.内联样式具有最高优先级；
ID、类别、元素啥的，排顺序就是越来越小的那个样儿。
巧妙运用各种选择器，可构造清晰简洁的CSS结构。
开发时，遵循实际需求，灵活运用各种不同类型的选择器。
别瞎折腾内联样式和ID选择器了，试试好好利用下类别和元素选择器。另外，尽量避免过多的通配符。
我们的最终目的就是建立个好维护又能扩展的CSS结构，让开发变得既高效又方便。
看了我的文章你就会明白，怎样用各种种类和搭配方法控制DOM元素的外观和互动；还可以提高你做项目时用CSS优先级的水平，让你工作更快更有效！
* {
font-size: 12px;
}。
评论0