这就是我试过的(见这里):
body {
overflow: hidden;
}
span {
border: solid 2px blue;
white-space: nowrap;
text-overflow: ellipsis;
}
Run Code Online (Sandbox Code Playgroud)
基本上,当窗口变小时,我希望跨度用省略号缩小.我做错了什么?
text-overflow: ellipsis第二行的CSS ,这可能吗?我在网上找不到它.
例:
我想要的是这样的:
I hope someone could help me. I need
an ellipsis on the second line of...
Run Code Online (Sandbox Code Playgroud)
但是发生了什么事:
I hope someone could help me. I ...
Run Code Online (Sandbox Code Playgroud) 有没有解决方案在div中的最后一行添加省略号,流体高度(20%)?
我-webkit-line-clamp在CSS中找到了这个函数,但在我的例子中,行号将取决于窗口大小.
p {
width:100%;
height:20%;
background:red;
position:absolute;
}Run Code Online (Sandbox Code Playgroud)
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sed dui felis. Vivamus vitae pharetra nisl, eget fringilla elit. Ut nec est sapien. Aliquam dignissim velit sed nunc imperdiet cursus. Proin arcu diam, tempus ac vehicula a, dictum quis nibh. Maecenas vitae quam ac mi venenatis vulputate. Suspendisse fermentum suscipit eros, ac ultricies leo sagittis quis. Nunc sollicitudin lorem eget eros eleifend facilisis. Quisque bibendum sem at bibendum suscipit. …Run Code Online (Sandbox Code Playgroud)什么是最可靠和最安全的方法来确定当前页面发送或调用(通过AJAX)的页面.我不想使用$_SERVER['HTTP_REFERER'],因为(缺乏)可靠性,我需要调用的页面仅来自源自我网站的请求.
编辑:我希望验证从我的网站上的页面调用预先形成一系列操作的脚本.
我想在特定宽度的div内只包含两行内的文本.如果文本超出两行的长度,那么我想显示elipses.有没有办法用CSS做到这一点?
例如
Sample text showing wrapping
of text in only two line...
Run Code Online (Sandbox Code Playgroud)
谢谢
我使用这个webkit线夹,它适用于Chrome,但不适用于Firefox.以下是代码:
{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4; /* number of lines to show */
line-height: X; /* fallback */
max-height: X*4; /* fallback */
}
Run Code Online (Sandbox Code Playgroud)
我应该如何使它在Firefox上运行?
我有一个带有标题的wordpress网站,如果标题有超过50个字符,我需要在标题的末尾添加省略号(...)并将标题停止在50个字符.下面是我正在编写的PHP,但它似乎无法正常工作,寻求PHP大师教我正确的方法.任何帮助将不胜感激.
<?php if (strlen("the_title()") > 50) { ?>
<?php the_title(); ?>
<?php } if (strlen("the_title()") < 50) { ?>
<?php echo substr(get_the_title(), 0, 50); ?>...
<?php } ?>
Run Code Online (Sandbox Code Playgroud) 我希望在我的所有表行中实现统一的外观.当你看下面我的例子时,你可以看到中间的音符超过了4行而且不那么漂亮.

我希望将所有内容限制<td>为3行.
如果要显示的内容多于三行,那么它应该剪切内容... [click for more]并将内容放在可折叠元素中,这样当单击它时它将显示整个内容.
后者应该不是问题,但如何将内容限制为仅三行?我应该算一下角色来做出决定吗?有更好的策略吗?我顺便使用Django,但我很乐意使用javascript,jquery或任何css魔法来解决这个问题.
更新:
接受的答案非常好.然而,它带有一个警告,这是不容易解决的.如果你的邻居td已超过三行,而当前的td只有两行,我们将得到一个无限的while循环.

while($(this).innerHeight() / $(this).css('line-height').slice(0,-2) >= 3){ .. }
Run Code Online (Sandbox Code Playgroud)
由于$(this).innerHeight()相邻的单元格保持高度不能降低.我想如果有可能得到当前td的css并将其完全复制到一个单独的字段中,其中相邻的tds不会干扰,我们将获得最佳解决方案.
更新2:
正如阿萨德所提到的,解决方案是在内容周围放置一个div包装器td,并将类设置在div内部td而不是td自身上.它完美无瑕.
我希望 的内容.main限制为 5 行,超过该行时,我想显示省略号。
.main {
width: 100px;
margin-bottom: 6px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}Run Code Online (Sandbox Code Playgroud)
<div class="main">
<ul>
<li>hello1</li>
<li>hello2</li>
<li>hello3</li>
<li>hello4</li>
<ul>
<li>hello5</li>
<li>hello6</li>
<li>hello7</li>
<li>hello8</li>
</ul>
</ul>
</div>Run Code Online (Sandbox Code Playgroud)
这在 Chrome 中按预期工作,内容在第 5 行后以省略号结束。但在 Safari 中,最终没有显示省略号。此外,Safari 显示 6 行而不是 5 行。请参阅下面的屏幕截图。
有人对如何在 Safari 中修复它有任何建议吗?
版本:
Chrome:版本 85.0.4183.121(官方版本)(64 位)
Safari:版本 13.1.2