CSS高级

    本系列文章的内容绝大部分来自w3cschool,再次表示感谢。

1. CSS尺寸

  • height    设置元素高度
  • line-height  设置行高
  • max-height      设置元素最大高度
  • max-width         设置元素最大宽度
  • min-height  设置元素最小高度
  • min-width    设置元素最小宽度
  • width       设置元素宽度
  • 上述属性,都可以接受auto, number, 百分数作为值。但是不同属性中,百分数的含义以及number的含义不同。

2. CSS分类

  • clear, 设置一个元素的侧面是否允许其他的浮动元素
  • cursor, 规定当指向某元素之上时显示的指针类型。具体的指针类型包括Auto, Crosshair,Default,Pointer, Move,e-resize,ne-resize,nw-resize,n-resize,se-resize,sw-resize, s-resize, w-resize, text, wait, help
  • display,设置是否及如何显示元素
  • float,设置元素的浮动方向
  • position,设置元素的定位方式
  • visibility, 设置元素是否可见,可选值包括visible,hidden,collapse

3. CSS伪类

  • 伪类的语法是    selector : pseudo-class{ property: value },前面的selector可以是任意形式的selector
  • 链接a有几个伪类,分别是link, visited, hover, active。它们分别表示未访问过的链接,访问过的链接,鼠标悬停在链接上,活动的链接。要注意,hover必须放在link和visited之后,active必须放在hover之后。
  • CSS2中增加了focus, first-child, lang三个伪类

4. CSS伪元素

  • 伪元素的语法是    selector : pseudo-element {property: value}
  • first-line, 设置首行特效
  • first-letter,设置首字母特效
  • before,在某个元素之前插入内容,CSS2
  • after,在某个元素之后插入内容,CSS2

5. CSS媒介类型

    @media 规则可以设置在相同的样式表中,针对不同媒介,使用不同的样式规则。比如:

@media screen {
p.test {font-family
:verdana,sans-serif; font-size:14px}
}
@media print
{
p.test {font-family
:times,serif; font-size:10px}
}

    可选的媒介包括:all,aural,braille,embossed,handheld,print,projection,screen,tty,tv

6. CSS Don't

    要避免在CSS中使用Internet Explorer Behaviors,因为只有IE支持这种东西。

原文地址:https://www.cnblogs.com/yuepeng/p/2012259.html