为什么input可以设置宽度

峭沙 2012-01-09 10:16:10
一直对这个问题相当的不解,按照css的定义,行内(内联)元素不是不可以设置宽度高度吗,为神马身为行内元素的input却可以呢?有没有大牛解释下
...全文
901 10 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
10 条回复
切换为时间正序
请发表友善的回复…
发表回复
tantaiyizu 2012-10-08
  • 打赏
  • 举报
回复
[Quote=引用 7 楼 的回复:]

好吧,经过测试原来这是firefox的bug。。JScript code
<!doctype>
<html>
<head>
<style>
</style>
</head>
<body>
<input type="text" value="text" id="input"/>
<script>
var input = document.getEl……
[/Quote]

谁说的IE6不支持inline-block?或者你是从哪里看到的?
lz12366007 2012-03-08
  • 打赏
  • 举报
回复
行内元素 button img都可以设置宽度。。。怎么解释
峭沙 2012-01-09
  • 打赏
  • 举报
回复
好吧,经过测试原来这是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能帮忙测下么?
峭沙 2012-01-09
  • 打赏
  • 举报
回复
什么是行内元素,什么是块级元素我懂,请不要给我扫盲好吗。。
峭沙 2012-01-09
  • 打赏
  • 举报
回复
[Quote=引用 3 楼 zsx841021 的回复:]

某次布局时无意发现一个有意思的问题。就是之前前的观念是<input>是内联元素,而内联元素的宽高都是不能定的。但是很明显<input>是可以给宽高的,为什么呢?要想弄清楚,首先我们要弄清inline-block这个属性,请点击这里查看:inline-block属性。其实很简单,inline-block特性就是元素的外部是内联元素,而内部确是块级元素特性,而<input>天生的inline-blo……
[/Quote]我以前就是这样理解的,但是。。还是你自己用firebug看一下吧。。
shenzhenNBA 2012-01-09
  • 打赏
  • 举报
回复
大致这样理解:
行内(内联)元素是相对于左右两边元素而言,于其它兄弟元素可同在一行内显示的可称行内元素,对于仅仅是数据显示类元素如span等,估计不能设置宽高吧,对于输入类元素,如input等可以设置高度。。。看来应该这样理解,
三石-gary 2012-01-09
  • 打赏
  • 举报
回复
某次布局时无意发现一个有意思的问题。就是之前前的观念是<input>是内联元素,而内联元素的宽高都是不能定的。但是很明显<input>是可以给宽高的,为什么呢?要想弄清楚,首先我们要弄清inline-block这个属性,请点击这里查看:inline-block属性。其实很简单,inline-block特性就是元素的外部是内联元素,而内部确是块级元素特性,而<input>天生的inline-block属性。这样就好解释了,<input>元素并没有另起一行,因为它的外部是内联元素,但它可以定宽高,因为它的内部是块级元素。所以在说内联元素和块级元素的时候,一定要将<input>做为一个特例来理解。..

这是某个人的解释。。。
峭沙 2012-01-09
  • 打赏
  • 举报
回复
用firebug看下你就知道是不是行内元素了,以前我一直想当然的以为input是inline-block,今天才发现,这货原来就是一活生生的inline元素,为什么这货可以设置宽度呢,这是为什么呢?
shenzhenNBA 2012-01-09
  • 打赏
  • 举报
回复
早,
那就说明input不是行内(内联)元素,是不是行内元素,完全可以通过CSS的定义来切换
Acesidonu 2012-01-09
  • 打赏
  • 举报
回复
就这么规定的

61,128

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧