css中的选择器_七种基本的css选择器

css中的选择器_七种基本的css选择器CSS选择器很强大下面是我在工作中使用最多的一些选择器:相邻素, 英文称为sibling, 也就是兄弟姐妹的意思.其实很形象, 比喻两个dom是相邻的.但是邻居很多, 紧密相邻的, 还是一大片邻居ad

css中的选择器_七种基本的css选择器

CSS选择器很强大

下面是我在工作中使用最多的一些选择器:

相邻素, 英文称为sibling, 也就是兄弟姐妹的意思.其实很形象, 比喻两个dom是相邻的.但是邻居很多, 紧密相邻的, 还是一大片邻居

  • adjacent sibling selector (+) 互相紧密相邻的
  • general sibling selector (~) 所有的邻居

孩子素, DOM是分为父素parent,和孩子素child

  • child selector (>)
  • 第一个孩子:first-child()
  • 最后一个孩子:last-child()

用`class`和`ID`来选择

  • div[“#id”]
  • div[“.class”]

用属性来判断

  • input[type=”text”]
  • input[type=”email]

用状态来判断

  • input:focus
  • button:disabled

还有个强大的功能, 在Scss和Sass中使用

& 表示当前选中的素, 所以可以用嵌套的方式, 但操作的是自己的

参考链接:
https://css-tricks.com/snippets/sass/caching-current-selector-sass/

参考链接:
https://www.w3schools.com/css/css_combinators.asp

2024最新激活全家桶教程,稳定运行到2099年,请移步至置顶文章:https://sigusoft.com/99576.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。 文章由激活谷谷主-小谷整理,转载请注明出处:https://sigusoft.com/16281.html

(0)
上一篇 2024年 9月 17日
下一篇 2024年 9月 18日

相关推荐

关注微信