美文网首页
Chapter 3 Id, 选择器, 伪类

Chapter 3 Id, 选择器, 伪类

作者: Candy374 | 来源:发表于2016-12-28 23:48 被阅读0次

CSS 命名规则:

只能使用字母,数字,下划线(_),连字符(-)

Id 的作用

可以作为锚点, 当访问url的时候,可以在后面加上#, 网页会直接定位到该标签
<div id="R">test</div>
访问的url : index.html#R
就可以直接定位到这个元素
name属性也有这个作用
<a name="R">test</a>
也可以实现相同的功能

Paste_Image.png Paste_Image.png

伪类:

  • :link
  • :hover
  • :visited
  • :active
  • :foucs
  • :not()
img:not(.port)
a[href^='http://']:not([href*="google.com"])
  • 用否定选择器只能使用简单的选择器(元素选择器, 通用选择器,类选择器,ID选择器或者伪类)
  • 不能使用派生选择器,伪类元素群组选择器或其组合
  • 不能使用多个否定选择器

伪元素

  • :first-line
  • :first-letter
  • :before
  • :after
  • ::selection . (只能设置color 和backgorund-color,必须双冒号)
  • :frist-child
  • :last-child
  • :nth-child
tr:nth-child(odd)
tr:nth-child(even)
tr:nth-child(3n+2)
  • :first-of-type
  • :last-of-type
  • :nth-of-type

属性选择器

  • 属性等于某个值
  • 属性以xxx开头 ^=
  • 属性以xxx结尾 $=
  • 属性包含xxx 。 *=
input[type="text"]
a[href^="http://"]
a[href$=".pdf"]
img[src*="headshot"]

相关文章

  • type class id选择器

    type选择器 class选择器 id选择器 伪类 动态伪类

  • 前端03

    1.伪类选择器 伪类专门用来表示元素的一种特殊的状态 2伪元素选择器 3选择器的优先级 内联样式ID选择器类和伪类...

  • 精通CSS高级Web标准解决方案读书笔记-02为样式找到应用目标

    常用选择器(类型选择器,后代选择器)p #id .class 伪类链接伪类:link :visited 动态伪类:...

  • Chapter 3 Id, 选择器, 伪类

    CSS 命名规则: 只能使用字母,数字,下划线(_),连字符(-) Id 的作用 可以作为锚点, 当访问url的时...

  • css选择器

    类选择器 .class ID选择器 #id 元素选择器 p 状态选择器(伪类 ) :status 位置选择器...

  • CSS的优先级

    内联样式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 元素(类型)选择器 = 伪元素选择器

  • 谈起 CSS 选择器你容易忽视的点

    伪类选择器 除去众所周知的 类选择器 和 ID 选择器外,还有相对接触不那么频繁的 伪类选择器和 伪元素选择器。而...

  • CSS选择器权重

    CSS中权重分为四个级别: 1. 内联样式 2. ID选择器 3. 类,伪类,属性选择器 4. 元素,伪元素 可以...

  • 高级选择器及伪类

    高级选择器及伪类 1. 回顾基础选择器 ID选择器 #id 类名选择器 .class 标签选择器 tagna...

  • css学习

    # 选择器 ## 标签 ## 类 ## ID ## 子选择 ## 后代 ## 伪类 ## 分组

网友评论

      本文标题:Chapter 3 Id, 选择器, 伪类

      本文链接:https://www.haomeiwen.com/subject/kdluvttx.html