CSS设置span高度的方法

关于javascript中的span
创建了一个span,里面加了一个table,span比较小,table比较大,要让
span出滚动条,但是span自动将边变大,可作出以下方法解决

<span style="width:300;height:200;overflow:auto">
.........
</span>

语法:

overflow : visible | auto | hidden | scroll

参数:

visible : 不剪切内容也不添加滚动条。假如显式声明此默认值,对象将被剪切为包含对象的window或frame的大小。并且clip属性设置将失效
auto : 此为body对象和textarea的默认值。在需要时剪切内容并添加滚动条
hidden : 不显示超过对象尺寸的内容
scroll : 总是显示滚动条

说明:

检索或设置当对象的内容超过其指定高度及宽度时如何管理内容。
设置textarea对象为hidden值将隐藏其滚动条。
对于table来说,假如table-layout属性设置为fixed,则td对象支持带有默认值为hidden的overflow属性。如果设为hidden,scroll或者auto,那么超出td尺寸的内容将被剪切。如果设为visible,将导致额外的文本溢出到右边或左边(视direction属性设置而定)的单元格。
自IE5开始,此属性在MAC平台上可用。
对应的脚本特性为overflow。


如果不对你的span做控制,作为你的table的父级容器会跟随你的子容器的宽,高而变形.所以你的span变大了.要想达到不变型的效果有两种方法.
1,用ifream内嵌一个页面,把你的table放在你内嵌的页面里面.
2,设置你的span的CSS属性overflow:scroll;

例子
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www .w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http ://www.w3.org/1999/xhtml " >
<head>
<title>Test Span</title>
<style type="text/css">

span {
background-color:#ffcc00;
display:-moz-inline-box;
display:inline-block;
width:650px ;
height:250px;
overflow:auto;
}

</style>
</head >
<body>
fixed<br>
<span >关于javascript中的span
创建了一个span,里面加了一个table,span比较小,table比较大,要让
span出滚动条,但是span自动将边变大,可作出以下方法解决

<span style="width:300;height:200;overflow:auto">
.........
</span>
语法:
overflow : visible | auto | hidden | scroll
参数:
visible : 不剪切内容也不添加滚动条。假如显式声明此默认值,对象将被剪切为包含对象的window或frame的大小。并且clip属性设置将失效
auto : 此为body对象和textarea的默认值。在需要时剪切内容并添加滚动条
hidden : 不显示超过对象尺寸的内容
scroll : 总是显示滚动条
说明:
检索或设置当对象的内容超过其指定高度及宽度时如何管理内容。
设置textarea对象为hidden值将隐藏其滚动条。
对于table来说,假如table-layout属性设置为fixed,则td对象支持带有默认值为hidden的overflow属性。如果设为hidden,scroll或者auto,那么超出td尺寸的内容将被剪切。如果设为visible,将导致额外的文本溢出到右边或左边(视direction属性设置而定)的单元格。
自IE5开始,此属性在MAC平台上可用。
对应的脚本特性为overflow。
如果不对你的span做控制,作为你的table的父级容器会跟随你的子容器的宽,高而变形.所以你的span变大了.要想达到不变型的效果有两种方法.
1,用ifream内嵌一个页面,把你的table放在你内嵌的页面里面.
2,设置你的span的CSS属性overflow:scroll; </span>
<br> span
</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值