第六章 浮动

标准文档流:
	指元素根据块级元素和行内元素的特性,按照从上到下,从左到右的顺序依次排列,这种方式是默认的排列方式
	 
	
	


一.块级元素和内联元素

	块级元素内容独占一行,内联元素内容自动拼接
	
	display属性:	块级元素与内联元素的相互转换
	
		block:	块级元素的默认值,将内联元素转换成块级元素
		inline:	内联元素的默认值,将内联元素转换为块级元素
		inline-block: 内联元素和块级元素特性都存在
		none:	隐藏元素,隐藏后位置不会被占用
		

二.浮动
	
	float:	设置元素的浮动
		left	:左浮动
		right	:右浮动
		none	:默认,不浮动
	
	clear:	清除元素浮动
		left	:清除此元素前左浮动元素
		right	:清除此元素前右浮动元素
		both	:清除此元素前左右浮动元素

三.防止防止父级边框塌陷的方法
	
	浮动元素后面加空div
		简单,空div会造成HTML代码冗余
	设置父元素的高度
		简单,元素固定高会降低扩展性
	父级添加overflow属性
		简单,下拉列表框的场景不能用(经常使用)
	父级添加伪类after
		写法比上面稍微复杂一点,但是没有副作用,推荐使用

  

原文地址:https://www.cnblogs.com/dabrk/p/9927144.html