css中省略号的样式

最新推荐文章于 2024-05-16 01:48:55 发布

沙漏无语

最新推荐文章于 2024-05-16 01:48:55 发布

阅读量2.8k

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/estelle_belle/article/details/43487699

版权

JavaScript 专栏收录该内容

81 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<style> 
div.test
{
white-space:nowrap; 
width:12em; 
overflow:hidden; 
border:1px solid #000000;
}

div.test:hover
{
text-overflow:inherit;
overflow:visible;
}
</style>

</head>

<body>

<p>如果您把光标移动到下面两个 div 上，就能够看到全部文本。</p>

<p>这个 div 使用 "text-overflow:ellipsis" ：</p>

<div class="test" style="text-overflow:ellipsis;">This is some long text that will not fit in the box</div>

<p>这个 div 使用 "text-overflow:clip"：</p>

<div class="test" style="text-overflow:clip;">This is some long text that will not fit in the box</div>

</body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

沙漏无语

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
css中省略号的样式

div.test{white-space:nowrap; width:12em; overflow:hidden; border:1px solid #000000;}div.test:hover{text-overflow:inherit;overflow:visible;}如果您把光标移动到下面两个 div 上，就能够看到全部文本。这个 div 使用
复制链接

扫一扫