Web前端学习心得重要知识点总结提醒

1. padding和border都会影响盒子的大小，可以通过计算适当减小hight，width的大小来控制盒子的大小达到指定值。
2. width和hight仅适用于块级元素，对行内元素无效（img标签和input标签除外）。
3. 网页布局开始常用全局Css控制  li{list-style:none} 取消li前边的小点   *{margin:0px;padding:0px} 取消所有的内外边距。
4. margin: auto; 只是左右居中，上下不起作用。（块元素）  。
5. 不指定盒子的高宽，padding就不会撑开盒子，可以子父盒子套用来控制子盒子边距小技巧。如果指定了子盒子的高宽就用margin来控制边距。
6. 浏览器bug问题  外边距合并问题，避免就是。
7. 嵌套块元素的垂直外边距合并问题，(overflow:hidden;)  解决方案给父盒子指定外边框或内边距隔开。
8. 行高等于盒子的高度可是内容水平居中。
9. text-align: center; 只能让盒子内容居中（文字 行内元素 行内块元素。
10. css格式化  清除一些我们用不到但是标签自带的样式。
11. 浮动在父盒子里的内容区域浮动，浮动只影响下边的标准流，浮动默认将块元素转换为行内块元素，行内元素加了浮动效果会自动变成行内块元素，有宽高，父盒子的宽度装不下子盒子时子盒子即使全是浮动也会被挤到下边。
12. 子盒子只继承父盒子的宽度，不继承高度。
13. 块级元素必须有宽度，否则是通栏的无法居中对齐。
14. 子盒子全部浮动，不指定父盒子的高度，不影响布局就要清除浮动：

         （1）父盒子(overflow:hidden;)

         （2）额外标签法，在最后一个盒子的后边加一个div  clear：both  清除浮动后父盒子自动检测最高子盒子的高度

   15.  相对定位不脱标，保留原来位置并移动到指定位置，每次移动的位置以自己之前位置的左上角为基点。

   16.  绝对定位与浮动一样会抛弃原来的位置，没有父盒子时以整个浏览器为基点移动，有父盒子但父盒子没有定位也以整个浏             览器为基准，如果父盒子有定位则以父盒子（最近的父盒子）为基准。

   17.  子绝父相是最常用的方法，父亲必须有定位，否则子会以整个浏览器为基准。

   18.  加了定位和浮动的盒子 margin：0 auto ；就会失效，无法再控制居中对齐。但是margin - left 之类的可以使用 定位后居中            对齐   posposition:absolute;    left:50%;  margin-left:-width/2 px；。

   19.  left:0   right :0  会发生冲突与权重无关，先左后右 ，先上后下。

   20.  固定定位只认浏览器为基准。

   21. 定位与浮动一样都会使元素变为行内块模式，宽高与内容有关。

   22. 层叠顺序问题，浮动是往下插，定位是往上插（后来者居上） z-index : 1;  将盒子提到最上（只有定位的盒子有）。

   23. display：none 隐藏元素之后不再显示保留位置，visibility:hidden 隐藏元素之后保留位置。

   24. overflow：auto ； 内容超出显示滚动条，不超出则不显示滚动条。

   25. cursor: xx ;  当鼠标经过时变成各种样式。outline：none  取消轮廓线。 resize：none；文本域取消拖拽。

   26. 图片、表单和文字对齐默认是和基线对齐，可以通过vertical-align来控制对齐方式。(只影响行内元素或者行内块元素)

   27.white- space; nowrap ; 强制文字一行内显示，overflow：hidden ； 超出部分隐藏 ，text-overflow:ellipsis;  文字超出后显示          省略号，三个设置一行不 能少。