手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >select和input不会继承字号body font-size
select和input不会继承字号body font-size
摘要:testbody{font-size:16px;}select,input{font-size:1em;}#page{width:600px...

<!DOCTYPE html>

<html lang="zh-Hans-CN">

<head>

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

<title>test</title>

<style>

body

{

font-size:16px;

}

select,input

{

font-size:1em;

}

#page

{

width:600px;

margin:0 auto;

}

</style>

</head>

<body>

<div id="page">

汉字

<form>

<select>

<option>汉字</option>

<option>English</option>

</select>

<input type="text" value="汉字" />

<input type="submit" value="汉字" />

</form>

<div id="footer">

<form id="change_ui" method="get" action="#">

页面宽度:<input type="text" id="page_width" name="page_width" value="960px" />

字号大小:<input type="text" id="font_size" name="font_size" value="20px" />

<input type="submit" value="OK" />

</form>

</div>

<script type="text/javascript">

document.getElementById('change_ui').onsubmit = function()

{

document.getElementById('page').style.width=this.page_width.value;

document.body.style.fontSize=this.font_size.value;

return false;

}

</script>

<div>

</body>

</html>

在Firefox 3.6.9、IE 9、IE 8中,select和input不会继承字号,无论在body中声明font-size是多少,select和input仍然显示为浏览器默认字号(一般为16px)。

所以写CSS要写上:

select,input

{

font-size:1em;

}

Firefox、IE 8的整体放大都能够放大select、input,为什么偏偏不能继承?真奇怪。

【select和input不会继承字号body font-size】相关文章:

纯CSS定义双色文字

CSS多个子框架居中

兼容IE6的图片圆角边框CSS

CSS教程:CSS的Background Images背景图片

css中默认中文字体font-family列表

IE6下图片下方有空间距的多种解决方法

CSS 面包屑导航栏2个例子

源自CODEPEN的25个最受欢迎的HTML/CSS代码

CSS首字下沉 :first-letter用法

CSS里随滚动条滚动代码

精品推荐
分类导航