不断更新--写页面时遇到的一点儿小问题

1.今天写新浪首页的时候，发现position为absolute的元素其父元素必须要指定高度，无法自适应高度，暂无解决办法。

6.29日   刚刚用jquery解决了这个问题 ，获得子无素的高度，然后设父元素的高度等于子元素的。

2.当Li的个数在Ul的宽度下无法均匀分布的情况下（一般就差那一两个像素，不调好实在看着难受），可以考虑一下将ul的右外边距设为负值

3.IE的background-image图片加载不了，但是FF和Chrome里却是正常的，原因是IE不支持自行修改格式的图片。

4.  7.4日 拿到一张设计图的时候，宁可多花点时间好好研究一下要怎么来写，哪些部分可以重用，重用的部分又有哪些不一样的地方，考虑好不一样的地方是否要单独写出来，如果这些不考虑清楚，后期改起来会非常地麻烦，写到一定的时候就去每个浏览器都测一下，及时解决兼容问题。 

5. 行内元素 左右内外边距均可用，但上下却不行，此时的解决办法，通过行高，或者将其设为inline-block/block,此时即可设置上下内外边距。

6.input之后的img图片不但不与input对齐，反而还会影响input原本的位置，最终还是调好了，除了都要加vertical-align:middle之外呢，后者容纳图片的标签也要加一个       display:block;

  补充：其实这也就是一个图片垂直居中于div的问题

              1) 给父div定义行高，img vertical-align:middle (不定义img vertical属性，你会发现图片貌似也已经在居中的位置上了，其实并没有，有偏差）

               2)给父div display:table-cell  且vertical-align:middle即可；

7.文字前面加一个背景图片，换行时会自然与背景图片对齐，但是这比较影响美观，若想要将两行文字对齐，将背景图片浮动即可。

8.关于如何让一个div在另一个div中水平居中

  1）.将父div  的display:table-cell,vertical-align:middle; 子div display:inline-block;

  2)  .给父div设个line-height；并且vertical-align:middle; 

  2）.用flex布局 ，父元素中添加   display: -webkit-flex; display: flex;  -webkit-align-items: center;   align-items: center;  水平居中是 -webkit-justify-content: center; justify-content:             center;

9.每次插入图片底下都会产生一条缝隙，今天查到原来是隐匿空白文本造成的，有三种办法可以解决此问题

    1）设置img的display:block;  2)设置Img的vertical:bottom;  3)设置Img的父元素的line-height:0;

    2）和这个相似的一个问题，两个行内框，一个是空白的，另一个里面有文字，这时可以发现两个行内框不但不对齐且相差很大，大概就是空白框的底部与第二个行内框的文字             底部对齐，此时将有文字的div 设置vertical-align:top/bottom都可。具体参照张鑫旭博客 http://www.zhangxinxu.com/wordpress/2015/08/css-deep-understand-vertical-align-and-line-height/