H5学习笔记

常用伪类

HTML有N多标签，根据显示的类型，主要可以分为3大类

• 块级标签
  独占一行的标签
  能随时设置宽度和高度（比如div、p、h1、h2、ul、li）

• 行内标签（内联标签）
  多个行内标签能同时显示在一行
  宽度和高度取决于内容的尺寸（比如span、a、label）

• 行内-块级标签（内联-块级标签）
  多个行内-块级标签可以显示在同一行
  能随时设置宽度和高度（比如input、button）

CSS中有个display属性，能修改标签的显示类型

• none：隐藏标签
• block：让标签变为块级标签
• inline：让标签变为行内标签
• inline-block：让标签变为行内-块级标签（内联-块级标签）

CSS有N多属性，根据继承性，主要可以分为2大类

• 可继承属性
  父标签的属性值会传递给子标签
  一般是文字控制属性

• 不可继承属性
  父标签的属性值不能传递给子标签
  一般是区块控制属性

可继承属性

• 所有标签可继承
  visibility、cursor

• 内联标签可继承
  letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction

• 块级标签可继承
  text-indent、text-align

• 列表标签可继承
  list-style、list-style-type、list-style-position、list-style-image

不可继承属性

display、margin、border、padding、background
height、min-height、max-height、width、min-width、max-width
overflow、position、left、right、top、bottom、z-index
float、clear
table-layout、vertical-align
page-break-after、page-bread-before
unicode-bidi]

边界边框属性

例子1

例子2

H5做屏幕适配的代码

@media screen and (max-width: 844px) {   }