资讯专栏INFORMATION COLUMN

CSS中有哪些常用选择器?

VioletJack / 2789人阅读

摘要:一选择器有哪些中的选择器很多,比如选择器,类选择器,通配符选择器,伪类选择器等等,接下来主要介绍常用的几个。组选择器语法选择器,选择器,选择器为为,为和的元素共同设置样式。子元素选择器语法父元素子元素选中父元素的指定子元素。

一、CSS选择器有哪些

CSS中的选择器很多,比如:ID选择器,类选择器,通配符选择器,伪类选择器等等,接下来主要介绍常用的几个。

1.标签选择器

语法:标签名{},eg:h1{}//为所有的h1元素设置样式。

2.ID选择器

语法:#id名{}//id值唯一不能重复,eg:#top{}//为id为top的元素设置样式。

3.类选择器

语法:.class{},eg:.box{}//为所有的class值为box的元素设置样式。

4.组选择器

语法:选择器1,选择器2,选择器N{},eg:#box1,.box2,p{}//为id为box1,class为box2和p的元素共同设置样式。

5、通配符选择器

语法:*{},eg:*{font-size:16px}//将整个页面字体大小设为16px。

6.后代选择器

语法:选择器1选择器2{},eg:p.aa{}//选中指定祖先元素p的指定后代.aa。

7.子元素选择器

语法:父元素>子元素{},eg:p>.box{}//选中父元素p的指定子元素.box。注意与后代元素选择器的区别

8.伪类选择器

伪类可以用来表示一些特殊的状态,如:

:link-未访问过的超链接。

:visited-已访问过的超链接。

:hover-鼠标经过的元素。

:active-正在点击的元素。

eg:a:hover{color:red}//鼠标经过a标签时,颜色变为红色。

二、CSS选择器的优先级顺序

当同一属性的不同值都作用到了同一个元素时,如果定义的属性之间有冲突,那么应该用谁的值的,这个时候就涉及到CSS的优先级顺序了。

1.在属性后面使用!important会覆盖页面内任何位置定义的元素样式。

2.作为style属性写在元素内的内部样式

3.id选择器

4.类选择器

5.标签选择器

6.通配符选择器

7.浏览器自定义或继承的

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/117405.html

相关文章

  • 重拾css(5)——浏览默认样式

    摘要:而依然有效的原因是浏览器默认样式的优先级低于外联内部样式。例如第二,浏览器默认样式还为设置了,这个值是对英文比较友好,中文状态下就显得有点拥挤。 上一节介绍了样式的五种来源,咱们再通过一张图回顾一下。 showImg(https://segmentfault.com/img/bVM2Rk?w=536&h=245); 对于上面的三层,咱们大概都比较熟悉了。下面的两层中,用户自定义样式一般...

    guqiu 评论0 收藏0
  • css-从笔试题中看知识

    摘要:常见子元素居中方式原理是绝对定位是根据左上角,然后让子元素回移就居中了水平居中,条件是当前元素指定宽和高水平垂直居中描述图形的语言中的每个元素都是可用的。您可以为某个元素附加事件处理器每个被绘制的图形均被视为对象。 常见子元素居中方式 (1) position: absolute: position: absolute; + transform: translate(-50%, -50...

    tainzhi 评论0 收藏0
  • 列举几条常用CSS reset,是否了解normalize.css

    摘要:相比于传统的是一种现代的为准备的优质替代方案。总之,是一种的替代方案。一般化的样式为大部分元素提供。保护了有价值的默认值通过为几乎所有的元素施加默认样式,强行使得元素有相同的视觉效果。 Normalize.css只是一个很小的css文件,但它在磨人的HTML元素样式上提供了跨浏览器的高度一致性。相比于传统的CSS reset,Normalize.css是一种现代的、为HTML5准备的优...

    Airy 评论0 收藏0
  • 拒信收割机の前端面经(CVTE,唯品会,百度)

    摘要:另外回答的时候要淡定,一些问题就算不懂也不能慌,要和面试官谈笑风生,然后尽量扯回到自己懂的东西上面大公司比如百度给我的感觉就是很重视基础思维和潜力。 —— 虽然我的offer少,但是我的拒信多啊 这几天终于闲下来,做一点微小的工作,整理了一些之前几家公司的前端面试题和个人经验,想做前端的师弟妹可以参考,也欢迎各同行大神来指教~ (以下问题不分先后,时间久远难免有些遗漏;很多问题面试官都...

    yzd 评论0 收藏0

发表评论

0条评论

VioletJack

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<