css选择器的分类、优先级问题以及css的引入方式

在 css 中,选择器是一种模式,用于选择需要添加样式的元素。

css选择器的分类:

1.class选择器:

根据class属性值获取具有指定属性值的一类标签。

比如:


2.标签名选择器:

主要用于具有相同名字的多个标签。

比如不同div中的p标签,img标签,a标签等等。

3.id选择器:

根据标签id属性值获取标签,但是注意同一个网页中同一个id值只能出现一次,因此该操作可以实现明确查找某一个标签。

(注意:id选择器在开发中一般不建议大面积使用,在开发中首选class选择器。)

4.通配符选择器:

选择所有标签(该选择器一般只出现在css样式开头,完成样式重置)。



选择器优先级划分:

1.id选择器优先级为100

2.class选择器优先级为10

3.标签名选择器优先级1

4.通配选择器优先级为0



css样式的引入方式:

1.外部引入:

首先,在文件夹创建一个对应的css文件;

然后,在css文件内部设置标签的css样式;

最后,在需要使用该css文件的html文件中通过link标签完成对css文件的引入。

(使用场景:该引入方式适用于网页同一时间网页访问量不大的情况,比如公司的二级以下页面)

2.内部引入:

直接在head标签内部添加style标签设置css样式。

(使用场景:当页面同一时间访问量比较大的时候需要使用,比如公司首页,电商类网站,活动页面等)

3.行间样式:

直接在标签添加style属性设置css样式。

(注意:行间样式修改的css样式优先级仅次于importent,在开发过程中,行间样式和importent都不建议使用)

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 课程目标: 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握C...
    繁华退却阅读 5,691评论 0 0
  • 篇首语 也许你觉得你已经理解了CSS方面的知识了,确实CSS和HTML的学习特点也是先易后难。如果你觉得CSS很简...
    thisDong阅读 4,925评论 1 9
  • CSS基础 本文包括CSS基础知识选择器(重要!!!)继承、特殊性、层叠、重要性CSS格式化排版单位和值盒模型浮动...
    廖少少阅读 8,514评论 0 40
  • 一、CSS选择器 关于CSS选择器,首先请看这里:CSS 选择器参考手册 通过以上,我们可以将CSS选择器分为以下...
    fehysunny阅读 6,743评论 0 2
  • 其实平时用得多的选择器无非也就是那么几个,时间久了,许多不常用的选择器就慢慢忘记了。为了不让自己忘记这些选择器,今...
    盛夏晚清风阅读 5,829评论 0 5