CSS控制文字溢出时的自动隐藏方法

CSS控制文字溢出时的自动隐藏方法

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “”>
<html xmlns=””>
<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 />

<!– 我们看到中英语字符隐藏了,但中文没有隐藏,这里我们要知道英文不会自动换行,而中文会,所在我们在要中加上 white-space:nowrap; 强制不换行–>

<style>
 ul{ width:120px;overflow:hidden;white-space:nowrap;}
</style>

在ie中看到的:

fdafdafdafda
中国国震荡城

</html>

本站原创转载注明

CSS控制文字溢出时的自动隐藏方法

相关文章:

你感兴趣的文章:

标签云: