如何显示点（……）如果内容超过html[重复]

Question

我尝试过使用文本溢出：省略号；这种语法但它不起作用，任何人都可以帮助我

Html

   <div class="product-desc">
         <p>How to show dots if text is exceeds than the limit</p>
    </div>

我用过的风格

.product-desc{
    padding: 0.8em 1.5em;
    background: #337AB7;
    text-align: center;
     text-overflow: ellipsis;
}
.product-desc p{
    font-size: 1.2em;
    color: #fff;
    margin-bottom: 0.5em;
    font-family: 'Carrois Gothic', sans-serif;
}

Answer 1

请尝试以下操作：

.product-desc p{
    font-size: 1.2em;
    color: #fff;
    margin-bottom: 0.5em;
    font-family: 'Carrois Gothic', sans-serif;
    width:180px;
    white-space: nowrap;
    overflow:hidden !important;
    text-overflow: ellipsis;
}