CSS盒子模型

1 盒子模型

盒子模型是指css指定一个块级元素与周围的关系，是一种定义，有4个

边距	边框	边框与内容之间的填充	内容
margin(幅度，边沿)	border	padding(填充)	content

设置上边距：margin-top: 15px;
设置右边距：margin-right: 40px;

---

2 Table

用法

1. table里最多的行数是多少，就是一共有几行，就是几个tr；
2. td的宽度，在style里设置width；
3. table 的 border 属性已经废弃, 改为放到 style 中

<table border="1" style="border: 1px solid" cellspacing="0">

关于 table 的属性

alignment 结成联盟; 对齐;
horizon 希腊文“限定” horizontal
vertex 拉丁文“最高点;顶上;山顶“ vertical

Vertical Alignment 垂直对齐方式: 居中 居右 居左
Horizontal Alignment 水平对齐方式

px = pixel; (绝对
em = parent; rem = root; (相对

brow 额头 browse 随便看看;逛街; browser 逛街的人
border = 边界; (左边框、右边框、上边框、下边框)

column 柱子; 列
row 争吵; 噪声; 划船; 一排; record;
span 持续时间; 范围; 宽度;

ColSpan = column span (列持续: 合并列 横向)
RowSpan = row span (行持续: 合并行 竖向)

rowspan, colspan 用法

• colspan 属性规定单元格可横跨的列数 colspan=“2”
• rowspan 属性规定单元格可竖跨的行数 rowspan=“2”

列跨距的数值，比如有表格内有两行 第一行两个单元格，colspan值各为1 第二行有一个单元格， 如果colspan为1，那它与第一行的第一个单元格同宽； 如果colspan为2，那它的宽度为第一行两个单元格的宽度。

横向colspan: 写了colspan == 写了后面几个空格子 (只在这一行生效，下一行不用管，其他照旧写)
竖向rowspan: 写了rowspan == 到了下一行的该列写了一个在这里（这个第几个取决于写了rowspan的那个在第几个位置）

rowspan 的特殊值: 0

• rowspan=“0” 值可以生效, 表示横跨到表格的最后一行
• colspan=“0” 在html5中已经完全被废弃, 不会生效

3 记住滚动条

// 记住滚动条
window.history.scrollRestoration && (window.history.scrollRestoration='auto');
// auto 改为 manual 则不记住滚动条

• js 变量提升
  待续

PS: Java 中的箱子

• Java装箱：Integer.valueOf(1234);
• Java拆箱：num1.intValue();