选择器和文本标签

选择器的辨别

1.Type Selector:
plate
2.Type Selector:
bento
3.ID Selector:
  #fancy
4.Descendant(后代)Selector:
plate apple
5.Combine the Descendant & ID Selectors(合并后代和ID选择器):
 #fancy pickle
6.Class Selector:
.small
7.Combine the Class Selector:
orange.small
8.bento orange
9.Comma Combinator:
plate,bento
10.(The Universal Selector)通用选择器:
*
11.Combine the Universal Selector()
plate *
12.Adjacent Sibling Selector(相邻选择器):
plate+apple
13.General Sibling Selector(一般兄弟姐妹选择器):
bento~pickle
14.Child Selector:
plate>apple
15.First Child Pseudo-selector:
p :first-child
16.Only Child Pseudo-selector:
plate :only-child
17.Last Child Pseudo-selector
.small:last-child
18.Nth Child Pseudo-selector:
:nth-child(3)
19.Nth Last Child Selector
:nth-last-child(4)
20.First of Type Selector
apple:first-of-type
21.Nth of Type Selector
:nth-of-type(even)
22.Nth-of-type Selector with Formula(带式选择器式选择器)
:nth-of-type(2n+3)
23.Only of Type Selector
apple:only-of-type
24.Last of Type Selector
.small:last-of-type
25.Empty Selector
bento:empty
26.Negation Pseudo-class:否定伪类
apple:not(.small)

选择器的分类

类型 语法
元素选择器 标签名
类选择器 . 类名
id选择器 #id名
复合选择器 A.B
群组选择器 A,B
通用选择器 *
后代选择器 A B(>表示只是子一代)
选择第一个子标签 :first-child
选择最后一个子标签 :last-child
选择指定位置的子元素 :nth-child(A)
选择指定类型的子元素 :first-of-type,:last-of-type,:nth-of-type
兄弟选择器 +表示后边一个元素,~表示后面所有元素
否定伪类 :not(X)

CSS权重的等级划分

  1. !important,加在样式属性值后,权重值为 10000
  2. 内联样式,如:style=””,权重值为1000
  3. ID选择器,如:#content,权重值为100
  4. 类,伪类和属性选择器,如: content、:hover 权重值为10
  5. 标签选择器和伪元素选择器,如:div、p、:before 权重值为1
  6. 通用选择器(*)、子选择器(>)、相邻选择器(+)、同胞选择器(~)、权重值为0

文本标签

着重点通常为斜体
重要性通常为粗体
类似于上边没有语义只是斜体和粗体
小一个字号
使用cite标签可以指明对某内容的引用或参考。


blockquote和q表示标记引用的文本。
blockquote用于长引用,q用于短引用。
上标下标
下划线删除线
    无序列表
      有序列表
      定义列表

      文本格式化

      px:像素
      em:相对于font-size来说:1em = 1font-size
      RGB
      – RGB(100%,0%,0%)
      – RGB(0,255,0)
      RGBA
      RGBA表示一个颜色和RGB类似,只不过比RGB多了一个A(alpha)来表示透明度, 透明度需要一个0-1的值。0表示完全透明,1表示完全不透明。– RGBA(255,100,5,0.5)

      字体

      font-size:设置大小
      font-family:设置类型,可以多个类型例如:p{font-family:Arial , Helvetica , sans-serif}
      font-style用来指定文本的斜体。
      指定斜体:font-style:italic
      指定非斜体:font-style:normal
      font-weight用来指定文本的粗体。
      指定粗体:font-weight:bold
      指定非粗体:font-weight:normal

      font语法:
      font:加粗 斜体 小型大写 大小/行高 字体
      这里前边几个加粗、斜体和小型大写的顺 序无所谓,也可以不写,但是大小和字体 必须写且必须写到后两个。
      

      line-height用于设置行高,行高越大则行 间距越大。
      行间距 = line-height – font-size

      text-transform样式用于将元素中的字母全都变成大写。
      大写:text-transform:uppercase
      小写:text-tansform:lowercase
      首字母大写:text-transform:capitalize
      正常:text-transform:none

      text-decoration属性,用来给文本添加各 种修饰。通过它可以为文本的上方、下方 或者中间添加线条。
      可选值:
      underline
      overline
      line-through
      none

      letter-spacing用来设置字符之间的间距。
      word-spacing用来设置单词之间的间距。
      这两个属性都可以直接指定一个长度或百 分数作为值。正数代表的是增加距离,而 负数代表减少距离。

      text-align用于设置文本的对齐方式。
      可选值:
      left:左对齐
      right:右对齐
      justify:两边对齐
      center:居中对齐

      text-indent用来设置首行缩进。
      该样式需要指定一个长度,并且只对第一 行生效

你可能感兴趣的:(选择器和文本标签)