1、开发网站过程中需要使用的图片都是美工提前处理,遇到不合适的需要使用Photoshop进行裁剪操作,不适合使用代码来处理图片。
2、过大或者不合适的图片容易造成浏览器的兼容问题或者维护不便,另外也影响占用带宽。
<!DOCTYPEhtml
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>
<meta
http-equiv="Content-Type"
content="text/htmlcharset=UTF-8">
<style
type="text/css">
.text
{
height:
40px
overflow:
hidden
width:
300px
word-wrap:
break-word
}
</style>
</head>
<body>
<div
class="text">
only
two
only
two
only
two
only
two
only
two
only
two
only
two
only
two
only
two
only
two
only
two
only
two
only
two
only
two
only
two
</div>
</body>
</html>
问题说明:
首先把高度固定了,然后使用overfow:hidden
把超出部分隐藏,效果请运行代码查看