61,112
社区成员
发帖
与我相关
我的任务
分享为什么这里line-height无效？
<html>
<head>
<title>内容页</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
</head>
<style type="text/css">
/*标题样式*/
#title{
font:bold 25px 黑体;
text-align:center;
}
/*除标题外文字样式*/
#word{
font:15px 宋体;
line-height:20px;
}
/*整个表单左填充15px样式*/
#allForm{
padding-left:15px;
}
/*表单距离10px样式（文本外边距）*/
.spaceMargin{
margin-left:10px;
}
</style>
<body>
<div id="title">注册页</div>
<div id="word">
<form method="post" action="" enctype="multipart/from-data" id="allForm">
姓名：
<input name="name" type="text" size="20" maxlength="6" class="spaceMargin" /><br/>
密码：
<input name="password" type="password" size="21" class="spaceMargin" /><br/>
性别：
<input name="sex" type="radio" value="男" checked="checked" />男
<input name="sex" type="radio" value="女" />女<br/>
照片：
<input name="files" type="file" class="spaceMargin" /><br/>
爱好：
<input name="hobby" type="checkbox" value="书" />书
<input name="hobby" type="checkbox" value="运动" />运动
<input name="hobby" type="checkbox" value="聊天" />聊天<br/>
所在城市：
<select name="city" size="1">
<option value="0" selected="selected">请选择</option>
<option value="1" >上海</option>
<option value="2" >北京</option>
<option value="3" >南京</option>
</select><br/>
<br/>协议：<br/>
<textarea cols="27" rows="6" readonly="readonly">请遵守相关规定，互相尊重，营造良好氛围。</textarea><br/>
<input name="hasread" type="checkbox" value="读过没" checked="checked" />我认真阅读并接受以上协议。<br/>
<input name="提交" type="submit" value="提交" disabled="disabled" />
<input name="提交" type="reset" value="重置" />
</form>
</div>
</body>
</html>#word的ID标识中设置了line-height:20px;
而且用<div id="word">括起来了，
为什么这个表单元素中行高都没变？
...全文
请发表友善的回复…
发表回复
Rick____ 2011-10-31
- 打赏
- 举报
4，5楼幸苦了，你们方法不行
3楼正解 非常感谢！
3楼正解 非常感谢！
凉粉zzz 2011-10-31
- 打赏
- 举报
#word写在form里就行了
sunen 2011-10-31
- 打赏
- 举报
在中间插入一个DIV，定义样式即可
<html>
<head>
<title>内容页</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
</head>
<style type="text/css">
/*标题样式*/
#title{
font:bold 25px 黑体;
text-align:center;
}
/*除标题外文字样式*/
body{
font:15px 宋体;
}
.hanggao{
margin:20px 0;
}
/*整个表单左填充15px样式*/
#allForm{
padding-left:15px;
}
/*表单距离10px样式（文本外边距）*/
.spaceMargin{
margin-left:10px;
}
</style>
<body>
<div id="title">注册页</div>
<div>
<form method="post" action="" enctype="multipart/from-data" id="allForm">
姓名：
<input name="name" type="text" size="20" maxlength="6" class="spaceMargin" /><br/>
<div class="hanggao"></div>
密码：
<input name="password" type="password" size="21" class="spaceMargin" /><br/>
<div class="hanggao"></div>
性别：
<input name="sex" type="radio" value="男" checked="checked" />男
<input name="sex" type="radio" value="女" />女<br/>
<div class="hanggao"></div>
照片：
<input name="files" type="file" class="spaceMargin" /><br/>
<div class="hanggao"></div>
爱好：
<input name="hobby" type="checkbox" value="书" />书
<input name="hobby" type="checkbox" value="运动" />运动
<input name="hobby" type="checkbox" value="聊天" />聊天<br/>
<div class="hanggao"></div>
所在城市：
<select name="city" size="1">
<option value="0" selected="selected">请选择</option>
<option value="1" >上海</option>
<option value="2" >北京</option>
<option value="3" >南京</option>
</select><br/>
<div class="hanggao"></div>
<br/>协议：<br/>
<textarea cols="27" rows="6" readonly="readonly">请遵守相关规定，互相尊重，营造良好氛围。</textarea><br/>
<input name="hasread" type="checkbox" value="读过没" checked="checked" />我认真阅读并接受以上协议。<br/>
<input name="提交" type="submit" value="提交" disabled="disabled" />
<input name="提交" type="reset" value="重置" />
</form>
</div>
</body>
</html>
javaxi 2011-10-30
- 打赏
- 举报
IE6当在一个容器里文字和img、input、textarea、select、object 等元素相连的时候，对这个容器设
置的line-height数值会失效。
解决问题思路：使容器里面的文字、img、input、textarea、 select、object（ie6只是支持文字）之
间有间距，并且是他们是居中的，那就只有模拟line-height属性了，说道这大家也就知道解决方案
了。
解决的办法就是对和文字相连接的img、input、textarea、select、object等元素加以属性
margin: (所属line-height-自身高度)/2px 0（实现了上下的间距）;
vertical-align:middle（让他们居中）。
置的line-height数值会失效。
解决问题思路：使容器里面的文字、img、input、textarea、 select、object（ie6只是支持文字）之
间有间距，并且是他们是居中的，那就只有模拟line-height属性了，说道这大家也就知道解决方案
了。
解决的办法就是对和文字相连接的img、input、textarea、select、object等元素加以属性
margin: (所属line-height-自身高度)/2px 0（实现了上下的间距）;
vertical-align:middle（让他们居中）。
Rick____ 2011-10-30
- 打赏
- 举报
还是没用啊- - 2楼。。
qixiaoqi1987 2011-10-30
- 打赏
- 举报
#word form{
line-height:60px;
}
line-height:60px;
}
