<!DOCTYPE html> <!-- 版本类型声明 --> <html lang="en"><!-- 根元素 --> <head> <meta charset="UTF-8"> <!-- 声明页面的编码格式 --> <title>20160722</title><!-- 将页面标题放到页面编码之下，防止乱码 --> <meta name="keywords" content="音乐，视频，电影"> <meta name="descrilition" content=""> </head> <body> <h1 style="text-align: center;">2016-07-29学习日志</h1> <hr> <h2>CSS布局</h2> <h3>float浮动</h3> <ul> <li>none|left|right</li> <li>先浮后动</li> <ul> <li>所有元素都可以浮动</li> <li>具有float属性的元素在父标签中是不占空间的</li> <li>float能解决标签之间有间隙的问题</li> </ul> <li>float对行内元素的影响</li> <ul> <li>float之后可以设置width和height属性</li> <li>全部支持margin和padding属性</li> </ul> <li>float对块属性标签的影响</li> <ul> <li>没有设置宽高的情况下浮动后，内容充开宽度高度可以使块属性元素并排排列</li> </ul> </ul> <hr> <h3>clear</h3> <ul> <li>none:允许浮动元素出现在两侧|left:左侧不允许有浮动元素|right:右侧不允许有浮动元素|both:两侧都不允许有浮动元素</li> </ul> <hr> <h3>overflow</h3> <ul> <li>visible</li> <li>hidden</li> <li>auto</li> <li>scroll</li> </ul> <hr> <h3>visibility</h3> <ul> <li>visible</li> <li>hidden:元素不可视，但占空间</li> <li>inherit:继承父元素的可视性</li> </ul> </body> </html>