html - 如何在 div 中将文本右对齐,以便它的开头因溢出 :hidden? 而被缩减

标签 html css overflow hidden right-align

<分区>

<div style="width:100px; overflow:hidden; text-align:right;" id="pathdiv">

<script>
    document.getElementById("pathdiv").innerHTML="long/path/to/file"
</script>

我的目标是在相对较窄的 div 中显示一条右对齐的长绝对路径,其开头部分被截断(以便显示路径中有趣的部分)。上面的代码使文本在适合 div 的情况下右对齐,如果不适合则将其剪切,但不幸的是它剪切了它的结尾,而不是开头。

如果字符串太长,我可以手动修剪字符串,但随后我必须以某种方式计算有多少字符适合它(不清楚)。

他们是否有任何直接的方式来实现我的目标(使用 CSS 或其他方式)?

最佳答案

<div style="width:100px; overflow:hidden; text-align:right;text-overflow:ellipsis; direction:rtl" id="pathdiv">

<script>
    document.getElementById("pathdiv").innerHTML="long/path/to/file"
</script>

添加 direction(rtl) 会起作用。

关于html - 如何在 div 中将文本右对齐,以便它的开头因溢出 :hidden? 而被缩减,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47926246/

上一篇:jquery - 如何自定义 Bootstrap 模式,如 tinybox js 弹出窗口

下一篇:jquery - 如何在中心显示 Owl Carousel 导航?

相关文章:

javascript - 输入[数字]箭头超出输入区域

html - 需要帮助更改索引页面描述文本字体大小,以便我可以将其用作标题和子标题?

css - 能否在网页上的单个图形图像周围和顶部放置多个事件元素?

HTML:我如何让 body 留在同一个地方

html - z-index + 溢出 :auto = bug?

javascript - 在 JS 中创建没有 Canvas 实例的 CanvasImageData 对象

javascript - Web 浏览器对看似畸形文件的容忍度

jquery - 如何制作可调整字体大小的响应式文本框/文本区域?

html - 使用溢出时无填充 : auto

html - 文本区域滚动条 Firefox 错误