两栏自适应布局--溢出省略

Posted 2020-09-02

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了两栏自适应布局--溢出省略相关的知识，希望对你有一定的参考价值。

1. 内容撑开宽度的.auto-content: 可以是内联元素，也可以是块状元素

.auto-content {
    float: right;
    overflow: hidden;
}

2. 宽度是余下所有的.auto-rest: 必须将内联元素装换成块状元素

.auto-rest {
    overflow: hidden;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
}

html代码如下：


<span class="auto-content">span<span>
<a href="#" class="auto-rest">alink</a>

以上是关于两栏自适应布局--溢出省略的主要内容，如果未能解决你的问题，请参考以下文章