前几个星期把网页的基础知识大致学习了一下，但是总归是学的是非常匆忙的，这两个星期一直在做网页，这几天做网页总觉得缺了点什么，有些东西没有系统的进行整理。今天上午到小组之后查阅了许多资料，在对资料的总结归纳理解的基础上用自己的语言，写了一些笔记，如下：
display
1.**display的特性**
- 块级元素与行级元素的转变
- 控制块元素排到一行：inline-block
- 控制元素的显示和隐藏：none
2.**display属性**
- block：块级元素的默认值，元素会被显示为块级元素，该元素前后会带有换行符，即块元素独占一行
- inline:行内元素的默认值，元素会被显示为行内元素，该元素前后不会带有换行符，即行内元素可以放在一行上。inline不能设置宽高，但是让inline浮动之后，该行内元素会转化为块元素，所以可以设置行高了。
inline-block:行内块元素，可以把块元素放在一行上
- none：元素会被隐藏。
3.#### display：
inline属性使元素内联展示，内联元素设置宽度无效，相邻的inline元素会在一行显示，不能设置宽高。但是给行内元素设置浮动之后，可以设置宽和高。
block的元素始终会独占一行，呈块状显示，可设置宽高。
inline-block的元素就是宽高可设置，相邻的元素会在一行显示。
4.inline-block： 当我们要设置某些元素在一行显示，并且排列方向一致的情况下，我们尽可能去用inline-block。因为inline-block的元素仍然在当前文档流里面，这样就减少了程序的更改操作，并且也不用担心父级边框塌陷的问题。
有两个元素，我们需要一个向左，一个向右排列，这时候我们就只能用float来实现，float能控制排列方向。
### float和display：都可以设置元素的宽和高，但是都不能设置方位。
float：
1.# float浮动：是针对块级元素的浮动
浮动：浮动使元素脱离正常的文档流，是元素移动到所处容器的边界，或者移动到触碰另一个浮动的元素。
### float：浮动设计的初衷，是为了实现文本环绕效果。
**left** ：元素会产生一个块级盒子向左浮动，正常的文档流会从这个盒子的右边和顶部开始。，即旁边的文字会紧靠着元素的右边或顶部。
**right** ：跟 `left` 属性值类似，只是元素产生的块级盒子向右浮动，正常的文档流会从这个盒子的左边和顶部开始。即旁边的文字会紧靠着元素的左边或顶部。
**none** ：这个盒子不浮动，会显示其在文本中出现的位置
设置元素的浮动为左或者右浮动，当设置元素浮动时，相邻元素会根据自身大小，排满一行，如果父容器宽度不够则会换行。当我们设置了元素的浮动时，这个元素就脱离了文档流，相邻元素会呈环绕装排列。
2.## 一浮多浮：一个块状元素设置为浮动，则其他的块状元素也需要设置浮动，当一个元素设置为浮动后，他附近的行内元素会自动跟上，即旁边的文字会紧靠着元素。
3.使用浮动如何改变元素定位。
#### 根据margin ，padding来设置元素的位置。
#### 设置元素的position以后 根据 left ，top 来设置位置。
4.浮动会导致的问题：父级元素塌陷。
父元素坍塌问题：大家应该知道，对于一个元素来说，不给他固定高度的时候他的高度是由内容撑开的，也就是说，如果这个元素里面没有任何内容，他的高度就是0，当这个元素有内容的时候，他就有了高度（也就是内容的高度），这也就导致了float元素的这个问题，当元素设置了float之后，它就脱离了文档流，也就是说此时父元素不再包含它，如果这时候盒子内没有其他元素的话，父元素的高度就会变为0。
今天下午五点半之后就闭组了，但是我的网页还没有达到要求，距离预订的考核时间也没剩多长时间了，闭组之后也不能放松，争取尽快考核。
这一阵做网页的成果如下：
虽然进度还是很慢，但是做网页的大部分时间都是自己敲出来的，不是照着视频敲的，这两个练手网页做完以后，相信我会对制作网页有更清楚的认知，制作网页会越来越顺。
