Maison > interface Web > Questions et réponses frontales > Comment définir le texte au-delà du masqué en CSS

Comment définir le texte au-delà du masqué en CSS

藏色散人
Libérer: 2021-06-01 11:16:20
original
4174 Les gens l'ont consulté

Comment masquer le texte en CSS : créez d'abord un nouveau fichier html ; puis utilisez la balise div pour créer une ligne de texte, puis définissez enfin l'attribut de classe de la balise div ; utilisez "overflow:hidden" en CSS pour obtenir le courant. Lorsque le texte du div dépasse la largeur, il peut être masqué sans être affiché.

Comment définir le texte au-delà du masqué en CSS

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

Créez un nouveau fichier html, nommé test.html, pour expliquer comment masquer la partie excédentaire en CSS.

Comment définir le texte au-delà du masqué en CSS

Dans le fichier test.html, utilisez la balise div pour créer une ligne de texte à tester.

Comment définir le texte au-delà du masqué en CSS

Dans le fichier test.html, définissez l'attribut de classe de la balise div sur txtdiv, qui est utilisé pour définir son style via cette classe ci-dessous.

Comment définir le texte au-delà du masqué en CSS

Dans la balise css, définissez le style du div via la classe, définissez sa largeur sur 100 px, sa hauteur sur 25 px et sa couleur d'arrière-plan sur gris.

Comment définir le texte au-delà du masqué en CSS

Dans la balise CSS, utilisez "overflow:hidden" pour la configurer pour qu'elle se cache et ne s'affiche pas lorsque le texte du div dépasse la largeur.

Comment définir le texte au-delà du masqué en CSS

Ouvrez le fichier test.html dans le navigateur pour afficher les résultats.

Comment définir le texte au-delà du masqué en CSS

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!

Étiquettes associées:
css
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal