Comment réaliser l'omission de l'affichage au-delà de deux lignes en CSS-tutoriel CSS-php.cn

Comment réaliser l'omission de l'affichage au-delà de deux lignes en CSS

藏色散人

Libérer： 2023-01-04 09:34:19

original

52461 Les gens l'ont consulté

Méthode CSS pour implémenter l'omission d'affichage au-delà de deux lignes : créez d'abord un exemple de fichier HTML ; puis définissez le contenu du texte dans le corps ; enfin définissez l'attribut "-webkit-line-clamp: 2;overflow" dans le style : Hidden;" pour obtenir l'effet au-delà de l'omission.

Comment réaliser l'omission de l'affichage au-delà de deux lignes en CSS

L'environnement d'exploitation de cet article : système Windows 7, version HTML5&&CSS3, ordinateur DELL G3

CSS se rend compte que le texte dépasse la partie et dépasse deux lignes. La partie excédentaire du texte est affichée avec des points de suspension

La partie excédentaire du texte est affichée avec des points de suspension

<style>
.p{
    width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
</style>
<body>
    <p class="p">
        我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本
    </p>
</body>

Copier après la connexion

Le le texte dépasse deux lignes, la partie excédentaire du texte est affichée avec des points de suspension

<style>
.p{
    width: 200px;
    word-break: break-all;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; /* 这里是超出几行省略 */
    overflow: hidden;
}
</style>
<body>
    <p class="p">
        我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本
    </p>
</body>

Copier après la connexion

Apprentissage recommandé : "tutoriel vidéo CSS"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!