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

最新推荐文章于 2024-05-08 16:46:32 发布

bymyself11

最新推荐文章于 2024-05-08 16:46:32 发布

阅读量3.4k

点赞数

分类专栏：使用知识及遇到的问题

本文链接：https://blog.csdn.net/bymyself11/article/details/54016547

版权

使用知识及遇到的问题专栏收录该内容

28 篇文章 0 订阅

订阅专栏

<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>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

bymyself11

关注关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
文字显示不完全鼠标移动上去文字全部显示

测试 * { margin: 0; padding: 0; } ul { font: 14px/30px 宋体; } a { text-decoration: none; } li a { width: 100px; display: block; /*内联对象需
复制链接

扫一扫