元素之塊級元素和行內元素特點(面試題)

行內元素:a,button.big,em,i,input,mark,span,select,option,strog,b,sup,sub,textarea,u

內聯元素是指本身屬性為display:inline的元素.因為它自身的特點,我們通常使用行內元素來進行文字\小圖標(小結構)的搭建

塊級元素:table,dl-dt-dd,figure,figcaption,div,h1-h6,hr,ul-li,ol-li,nav,p,form

本身屬性為display:block的元素；因為它自身的特點，我們通常使用塊級元素來進行結構的搭建佈局

行內塊狀元素img,input

塊級元素的特點

• 1.獨占一行,每一個塊級元素都會從新的一行重新開始
• 2.排列方式:從上到下依次排布
• 3.可以直接控制寬度、高度以及盒子模型的相關css屬性
• 4.在不設置寬度的情況下,塊級元素的寬度是它父級元素內容的寬度,高度是它本身內容的高度
• 5.塊級元素可以嵌套行內元素
• 6.ul/ol下麵只能是li;dl下麵只能是dt,dd;
• 7.p不能包裹其他塊級元素包括它本身,可以嵌套行內元素

元素之間的相互轉換

1. 行內元素=> display: inline
2. 塊級元素=>display: block
3. 行內塊元素=>display: inline- block

	<a href="#">
		<a href="#">大灰牛博客</a>
		www.dhnblog.com
	</a>

a標簽不能嵌套a標簽,即使我們嵌套了，最後瀏覽器也會解析為併列關係而不是嵌套關係