学习日志

一、知识总结

1、内边距 padding属性 位于边框和内容的距离 不能为负

2、盒子模型

content box:显示内容 width height

padding box:外部空白区域

border box:内容和外边距

margin box：盒子与其他的空白

3、标准盒模型 .box

padding border width height

4、替代盒模型 IE:border-sizing

5、盒子模型和内联盒子：

6、display属性

（1）block：呈块元素特征显示，前后带换行符

（2）inline: 呈内联元素特征，前后无换行符

（3）inline-block：元素保持行内高和宽，行内块元素

（4）none：不显示

7、背景样式

background属性

（1）background-color

（2）background-transparent：指定背景颜色

（3) transparent 指定背景颜色应该是透明的

（4） inherit 指定背景颜色，应该从父元素继承

8、background-repeat 属性可用值是:
（1）no-repeat — 不重复
（2）repeat-x —水平重复
（3）repeat-y —垂直重复
（4）repeat — 在两个方向重复

9、writing-mode 的三个值
（1）horizontal-tb : 块流向从上至下。对应的文本方向是横向的
（2）vertical-rl : 块流向从右向左。对应的文本方向是纵向的
（3）vertical-lr : 块流向从左向右。对应的文本方向是纵向的

10、overflow属性
（1）visible 默认值。内容不会被修剪，会呈现在元素框之外
（2）hidden 隐藏掉溢出。其余内容是不可见的
（3）scroll 显示滚动条，即使没有足够多引起溢出的内容
（4）auto 如果内容需要被修剪，则浏览器会显示滚动条以便查看其余的内容

11、font-style:字体风格

（1）normal - 文本正常显示

（2）italic - 文本斜体显示

（3）oblique - 文本倾斜显示

（4）text-decoration：字体加横线

（5）none 无

（6）underline 下划线

（7）overline 上划线

（8）line-through 贯穿线

（9）blink 文本闪烁

（10）text-align:字体所处位置

（11）left

（12）right

（13）center

（14）inherit 继承父元素的text-align属性

12、vertical-align 设置元素的垂直对齐方式

（1）baseline 默认。元素放置在父元素的基线上。

（2）sub 垂直对齐文本的下标。

（3）super 垂直对齐文本的上标

（4）top 把元素的顶端与行中最高元素的顶端对齐

（5）text-top 把元素的顶端与父元素字体的顶端对齐

（6）middle 把此元素放置在父元素的中部

（7）bottom 把元素的顶端与行中最低的元素的顶端对齐

（8）text-bottom 把元素的底端与父元素字体的底端对齐

二、心得体会

今天讲述内容单个看起来虽然简单，但比较零散，综合理解起来比较困难，整合起来不知道怎么使用，比较累。