文字显示不完全鼠标移动上去文字全部显示

创建时间：2017-01-04 投稿人：浏览次数：1505

<html>
	<head>
		<title>测试</title>
	</head>
	<body>
		<style>
			* {
				margin: 0;
				padding: 0;
			}
			
			ul {
				font: 14px/30px 宋体;
			}
			
			a {
				text-decoration: none;
			}
			
			li a {
				width: 100px;
				display: block;
				/*内联对象需加*/
				word-break: keep-all;
				/* 不换行 */
				white-space: nowrap;
				/* 不换行 */
				overflow: hidden;
				/* 内容超出宽度时隐藏超出部分的内容 */
				text-overflow: ellipsis;
				/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
			}			
			li a:hover {
				width: auto;
				/*或者width:100%;*/
			}
		</style>
		<ul>
			<li>
				<a href="#">i am so happy you are so funny</a>
			</li>
			<li>
				<a href="#">Today is wonderful day i am going shopping</a>
			</li>
		</ul>
	</body>
</html>

声明：该文观点仅代表作者本人，入门客AI创业平台信息发布平台仅提供信息存储空间服务，如有疑问请联系rumenke@qq.com。

上一篇： js for循环倒序输出数组元素
下一篇：没有了

热门文章: 文字显示不完全鼠标移动上...

最新文章: js for循环倒序输出数组元素...