javascript - Comment afficher du texte sur une ligne et le remplacer par... s'il dépasse le nombre de mots?
大家讲道理
大家讲道理 2017-05-19 10:13:23
0
7
904

Comme dans le titre, la largeur est fixe, si elle dépasse le nombre de mots, utilisez...

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

répondre à tous(7)
迷茫
overflow:hidden;white-space:nowrap;text-overflow:ellipsis;

overflow:hidden:超出隐藏
white-space:nowrap:强制不换行
text-overflow:ellipsis:超出省略号代替;

Portail, va le découvrir

为情所困

L'approche fixe nécessite les quatre conditions suivantes :
1.Fixed width
2.overflow:hidden
3.white-space:nowrap
4.text-overflow : points de suspension

小葫芦
 display: -webkit-box;
    box-orient: vertical;
    line-clamp: 3; // 可控制几行后有 ... 
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; // 兼容写法
    overflow: hidden;
    white-space:normal;
阿神

Tout d'abord, le premier point est de donner à cette ligne une largeur fixe. Même si vous ne donnez pas de largeur fixe, vous devez quand même limiter la ligne par la marge. Pour parler franchement, il s'agit de donner une largeur fixe à cette ligne. largeur fixe. . .
Les autres codes sont les suivants

如果是一个p标签
p{
    width:100px;//固定宽度
    overflow:hidden;//超出隐藏
    white-space:nowrap;//不换行
    text-overflow:ellipsis;//省略号
}
仅有的幸福

/a/11...
Deux méthodes d'implémentation, largeur fixe, affichage en excès..., survol de la souris pour omettre du contenu

巴扎黑
// line-clamp、line-height和height直接控制多行
.two-line {
    color: #333;
    line-height: 18px;
    height: 36px;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    display: -moz-box;
    -webkit-line-clamp: 2;
    -moz-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
  }
我想大声告诉你

Avec une largeur fixe, utilisez overflow:hidden;text-overflow:ellipsis;white-space:nowrap;

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!