HTML+CSS笔记

HTML

• 行级元素 (内联元素 inline)
  内容决定元素所占位置
  不可以通过CSS改变宽高
  eg. span strong em a del

• 块级元素（block）
  独占一行
  可通过CSS改变宽高
  eg. div p ul li ol form address

• 行级块元素（inline-block）
  内容决定大小
  可通过CSS改变宽高
  eg. img

  凡是带有inline的元素都有文字特性如img

预编译（函数执行前）

函数声明整体提升，变量--声明提升（var a = 5声明+赋值;只提升var a;）

imply global暗示全局变量：任何变量，如果未经声明就赋值，就为全局对象所有。
eg, a = 123; var a = b = 123, b也为全局对象所有，因为此句中，只给a声明，b未声明；

一切声明的全局变量，都是window的属性

预编译过程:

1. 创建AO对象（Activation Object）(执行期上下文)
2. 找形参和变量声明，将形参和变量名作为AO属性名，值为undefined
   AO{}
3. 将实参和形参统一
4. 在函数体里面找函数声明（var a = function {} 不是函数声明)

属性包含特性
特性： type, id, class, value
属性：setAttribute(), getAttribute(), 不是特性的属性与行间样式没有映射关系

包装类
数据类型：

• 原始数据（栈数据）,5个（没有自己的属性和方法）
  boolean, String, number, null, undefined
• 引用数据（堆数据），object

原始数据类型没有属性和方法，但有三个特殊的存在： Boolean，String，number，也被称作基本包装类型。有自己对应的包装对象，并且有相应的属性和方法。

使用Boolean(value)方法可以强制转换任意值为boolean类型,这六个值结果为false: undefined, null,0,false, “”, NaN;
其他都是自动转为true.

CSS

CSS权重
！important infinity
行间样式 1000
id 100
class|属性|伪类 10
标签选择器|伪元素 1
通配符 0

margin塌陷
垂直方向的margin(margin-top)，父子元素是结合在一起取最大值,
效果叫“margin塌陷”

BFC
bfc:block formate context

如何触发一个盒子的bfc:
position: absolute;
display: inline-block;
float: left/right;
overflow: hidden;溢出盒子的部分隐藏显示