1.哪些元素默认可以修改宽高?
1、
块级元素(display:block)都可以设置
div,p,h1,h6,ul,ol,li,dl,dt,dd
2、
存在width,height属性的html元素
img,table,input
ex:
图片(display:inline-block)非块级但可以修改宽高:
<img src="..." width="300px" height="400px"/>
表格(display:table)非块级但可以修改宽高:
<table width="200px;" height="300px">
<tr>
<td></td>
<td></td>
</tr>
</table>
表单控件(input)非块级但可以修改宽高:
<input type="text" name="" width="200px">
2.常规不能修改宽高的元素有哪些?
大部分的
行内元素: span,a,i,s,u,b,sup,sub,<input type="radio/checkbox">
3.如何修改那些不能设置宽高的元素(大多为行内元素)?
1、浮动
属性:float:left/right
元素一旦浮动起来之后,那么将变成块级元素,尤其对行内元素和行内块元素影响较大
2、修改显示方式
属性:
display
取值
1、none
没有显示方式,即不显示,隐藏
脱离文档流
常用场合:隐藏页面的元素。
2、block
让元素显示的和块级一样
常用场合:将行内元素 改变成 块级元素,以便于去修改元素的尺寸。
3、inline
让元素显示的和行内元素一样
注意:
不要将块级元素改变成行内元素。
4、inline-block
让元素显示的和行内块元素一样
行内块:一行内允许显示多个行内块元素,而且允许修改宽和高。
5、table
让元素表现的和table一样
尺寸自适应,独占一行
3、绝对定位
属性:
position:
absolute;
通过 top/bottom/left/right 实现位置移动和初始化
绝对定位的元素会变成块级元素,允许修改 尺寸