超出DIV边框的内容自动隐藏方法
发布时间:2016年2月3日 作者:未知 查看次数:1463
超出DIV边框的内容自动隐藏方法 CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法 平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱。 这样我们就需要解决如何使用CSS来超出设置CSS宽度和CSS高度的内容自动隐藏掉,又不撑破DIV布局。 特别是在IE6,如果内容超出对象高度和宽度承载,将会被撑破增高,这个时候我们可以利用以下解决方法。 解决CSS样式 这时我们可以使用CSS overflow样式解决: 对应样式overflow:hidden Div{overflow:hidden} 这样设置后,假如DIV对象设置一定宽度高度,此时加入overflow:hidden将会隐藏超出DIV宽度高度的内容包括图片。 代码: <html> <head> <title>文字从左边移动到右边</title> <script language="javascript"> <!-- i=0; function moveText(){ txt.style.left = i; i--; if(i <-200)i=100; setTimeout("moveText()",10);//前边的10是移动速度,数字越大,速度越慢 } //--> </script> </head> <body onLoad="moveText()"> <div style="position:absolute;overflow:hidden;left:100px;top:50px;max-height:80px;background-color:#FF0000;"> <div id="txt" style="position:relative;width=385">超出DIV边框的内容自动隐藏方法:我是从左边移动到右边的文字</div> </div> </body> </html>
|
|
|