Webkit Box Orient样式从样式中消失

css CSS

小宇宙

2020-03-24

在我的Angular应用中（我的版本为4.3.1），我在多行之后添加了CSS省略号。
为此，我在Sass中使用以下CSS代码。

.ellipsis {
    -webkit-box-orient: vertical;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

出于某种原因，盒装式线条仅通过移线从样式中删除，从而导致省略号不起作用。这似乎发生在Angular和Ionic应用程序中。

第3273篇《Webkit Box Orient样式从样式中消失》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共4个回答
猴子村村 2020.03.24

没有答案对我有用。

My solution was to put the -webkit-box-orient: vertical as inline-styling and the rest as a class. Not elegant, but it works.

JinJin 2020.03.24

以下为我工作。

.ellipsis {
/* autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */
display: block;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;

}

乐 2020.03.24

与先前介绍的解决方案类似，但是如果那是您的话，则少一行：

.ellipsis {
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
小宇宙 2020.03.24

包装-webkit-box-orient以下自动前缀代码似乎可以解决此问题。

.ellipsis {
    /* autoprefixer: off */
    -webkit-box-orient: vertical;
    /* autoprefixer: on */
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android