元素之块级元素和行内元素特点(面试题)

深渊向深渊呼唤

行内元素: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不能包裹其他块级元素包括它本身,可以嵌套行内元素

元素之间的相互转换

    行内元素=> display: inline 块级元素=>display: block 行内块元素=>display: inline- block
	<a href="#">
		<a href="#">大灰牛博客</a>
		www.dhnblog.com
	</a>

a标签不能嵌套a标签,即使我们嵌套了,最后浏览器也会解析为并列关系而不是嵌套关系

栏目
文章分类