为什么input可以设置宽度_html/css_WEB-ITnose-HTML 튜토리얼-php.cn

为什么input可以设置宽度_html/css_WEB-ITnose

WBOY

풀어 주다： 2016-06-24 12:15:24

원래의

1490명이 탐색했습니다.

一直对这个问题相当的不解，按照css的定义，行内(内联)元素不是不可以设置宽度高度吗，为神马身为行内元素的input却可以呢？有没有大牛解释下

回复讨论(解决方案)

早，
那就说明input不是行内(内联)元素，是不是行内元素，完全可以通过CSS的定义来切换

用firebug看下你就知道是不是行内元素了，以前我一直想当然的以为input是inline-block，今天才发现，这货原来就是一活生生的inline元素，为什么这货可以设置宽度呢，这是为什么呢？

某次布局时无意发现一个有意思的问题。就是之前前的观念是是内联元素，而内联元素的宽高都是不能定的。但是很明显是可以给宽高的，为什么呢？要想弄清楚，首先我们要弄清inline-block这个属性，请点击这里查看：inline-block属性。其实很简单，inline-block特性就是元素的外部是内联元素，而内部确是块级元素特性，而天生的inline-block属性。这样就好解释了，元素并没有另起一行，因为它的外部是内联元素，但它可以定宽高，因为它的内部是块级元素。所以在说内联元素和块级元素的时候，一定要将做为一个特例来理解。..

这是某个人的解释。。。

大致这样理解：
行内(内联)元素是相对于左右两边元素而言，于其它兄弟元素可同在一行内显示的可称行内元素，对于仅仅是数据显示类元素如span等，估计不能设置宽高吧，对于输入类元素，如input等可以设置高度。。。看来应该这样理解,

某次布局时无意发现一个有意思的问题。就是之前前的观念是是内联元素，而内联元素的宽高都是不能定的。但是很明显是可以给宽高的，为什么呢？要想弄清楚，首先我们要弄清inline-block这个属性，请点击这里查看：inline-block属性。其实很简单，inline-block特性就是元素的外部是内联元素，而内部确是块级元素特性，而天生的inline-blo…… 我以前就是这样理解的，但是。。还是你自己用firebug看一下吧。。

什么是行内元素，什么是块级元素我懂，请不要给我扫盲好吗。。

好吧，经过测试原来这是firefox的bug。。

<!doctype><html><head>	<style>	</style></head><body>	<input type="text" value="text" id="input"/>	<script>		var input = document.getElementById('input'),			input_style = window.getComputedStyle ? window.getComputedStyle(input, null) : input.currentStyle;		alert(input_style.display);	</script></body></html>

로그인 후 복사

在其他浏览器中，input的display=inline-block；而在firefox中却是inline。。不过又有一个疑问了，在ie6不支持inline-block，谁手头上有ie6能帮忙测下么？

就这么规定的

行内元素 button img都可以设置宽度。。。怎么解释

好吧，经过测试原来这是firefox的bug。。JScript code