1. CSS选择器的基本概念
掌握css选择器，你就会做网页样式！这玩意儿能让HTML元素看起来更美、更搭调。其实挺简单的，像元素选择器、类选择器、ID选择器还有属性选择器这些都要用得上。最有意思的是通配符选择器，不管HTML哪个元素它都能用，而且还不让其他代码受干扰。记得关键一点：用*就是整个网站的意思。
这选择通配符的方法听着很简单？有时候还挺实用！就比如你想要换个浏览器默认的外表，用它就能让所有东西的距离、字体大小都一致！无论在哪个浏览器上看网页，都会有一样的样子！
2. CSS选择器的优先级规则
咱说，css里面那个权重啊可不可忽视！排在前面也就代表优先展示。选器，主要就分这几类：id强过class，然后再到HTML元素和通配符。记牢点哈~
熟悉 CSS 选择器的优先级能帮我们省不少事儿！首先就是可以让你规划好样式的顺序，避免出现乱套或者被其他样式盖掉的情况；其次，当你想要解决问题时，它还能帮助你快速找到问题所在。
3.通配符选择器的权重和优先级
你可能没留意过，css中那个叫做“通配符选择器”的东西其实作用不大。混在各种其它类型的选择器里，它常常只能默默躲起来。
听好了，别给样式里加那么多通配符，看了头都大。你想个好记又好听的类名或ID才是正事儿，这对管理和掌握样式有好处！别忘了，还有其他选择器能让你的样式变得更棒！
4.示例代码分析
我们就拿个容易懂的例子来说说通配符选择器到底牛在哪儿！想像一下，现在你眼前有这么一串 CSS 代码：
css
*{
color: blue;
}
.my-class {
color: red;
/* 通配符选择器 */
* {
color: blue;
}
/* 类选择器 */
.my-class {
color: red;
}
/* ID选择器 */
#my-id {
color: green;
}
#my-id {
color: green;
再结合以下HTML代码：
“`html
<div class=”my-class” id=”my-id”>Hello, World!</div>
学CSS就像是挑选自己喜欢的衣服！先了解清楚各式各样的款式~接下来，利用ID挑选出最棒的样式，或者试试看类别的搭配是否合适。老话怎么说的来着？先选好最心仪的那件，然后尝试不同的组合！所以牢记这个规则：先用ID进行选择，接下来是类别，最后才考虑全名选择器。比如说“div”这种元素就要搭配上绿色~
5.优先级计算方法
This is a test.
搞定这件事，咱们要搞明白CSS优先级咋算，然后学会真刀实枪地干活儿。记住这几招就行了：
-每个ID属性值为100
-每个类、属性或伪类属性值为10
-每个元素或伪元素属性值为1
-通配符、子或相邻关系无属性值
看清楚这些CSS规则，懂得哪些得要让步，最后样子就出来了呗。
6.避免滥用通配符
大家是用通配符还是得悠着点哟～否则代码可能会乱套儿，还有点儿卡顿，对不？写CSS时，别急着用通配符，想明白是选哪个元素后，用ID，类，属性啥的精确定位设置个性风格就好~
7.最佳实践建议
要做项目就得学CSS，养成这三个习惯对管理和维护样式表特别有帮助！
-少用通配:除了特别需要的时候，尽量不碰通配符。
-挑个名字，加个ID：给HTML元素起个简短的类名或者 ID，这样用 CSS 就能轻松搞定。
-避免嵌套过深：过度嵌套会增加代码复杂度，并降低可读性。
-注释代码：合适添加注释可以帮助他人更好地理解代码意图。
亲爱滴，咱别让罗列在样式那的那堆东西占地儿，赶紧删掉那些用不着的！这么做就能让文档瘦身，打开速度就像火箭一样飙升~
8.总结
看了这一节，你就能明白为什么css中有不同的选择器，是它们来决定谁先出来展示，也就是咱们说的“权重”哩。这不就让咱们做网页时更方便些，做出的页面既美又好改！
评论0