CSS控制文字溢出时的自动隐藏方法
CSS控制文字溢出时的自动隐藏方法
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS控制文字溢出时的自动隐藏方法</title>
</head>
<body>
<style>
ul{ width:120px;overflow:hidden;}
</style>
<ul>
<li>fdafdafdafdafdsafdafdafsa\\\\\\==============</li>
</ul>
<!-- 这里我们可以定义ul 宽度这样上面内容超过了120的宽度就会自动隐藏了overflow就生效了 -->
再看实例
<ul>
<li>中国国震荡城市地厅城要魂牵梦萦地厅魂牵梦萦 </li>
<li>fdafdafdafdafdsafdafdafsa\\\\\\==============</li>
</ul>
fdafdafdafda
中国国震荡城<br />
市地厅城要魂<br />
牵梦萦地厅魂<br />
牵梦萦 <br />
<!-- 我们看到中英语字符隐藏了，但中文没有隐藏，这里我们要知道英文不会自动换行，而中文会，所在我们在要css教程中加上 white-space:nowrap; 强制不换行-->
<style>
ul{ width:120px;overflow:hidden;white-space:nowrap;}
</style>
在ie中看到的:
fdafdafdafda
中国国震荡城
</html>
www.111cn.cn 本站原创转载注明
