Maison > interface Web > tutoriel CSS > le corps du texte

Que dois-je faire si le texte numérique CSS est trop long et est masqué ?

青灯夜游
Libérer: 2023-02-17 15:01:51
original
3177 Les gens l'ont consulté

Solution au texte du numéro CSS caché qui est trop long : 1. Ouvrez le fichier HTML correspondant ; 2. Utilisez l'attribut "word-break" pour ajouter le style "word-break:break-all;" , afin que le texte numérique puisse être automatiquement enveloppé et affiché dans son intégralité.

Que dois-je faire si le texte numérique CSS est trop long et est masqué ?

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

Le texte numérique continu ne peut pas être automatiquement renvoyé à la ligne.

Que dois-je faire si le texte numérique CSS est trop long et est masqué ?

S'il est trop long et que l'élément conteneur est défini avec le style overoverflow: Hidden;, la partie excédentaire sera masquée. verflow: hidden;样式,那么超出的部分会被隐藏。

Que dois-je faire si le texte numérique CSS est trop long et est masqué ?

这时候我们,可以通过设置文本自动换行来将数字全部显示出来。

而想要设置自动换行,就需要使用word-break属性,该属性可以让浏览器实现在任意位置换行。

示例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" id="remove">
		<style>
			div{
				width: 200px;
				height: 100px;
				border: 1px solid red;
				overflow: hidden;
				word-break:break-all;
			}
		</style>
	</head>

	<body>
		<div>11111111111111111111111111111111111111111111111</div>
	</body>
</html>
Copier après la connexion

效果图:

Que dois-je faire si le texte numérique CSS est trop long et est masqué ?

说明:

word-break 属性规定自动换行的处理方法。

语法:word-break: normal|break-all|keep-all;

Que dois-je faire si le texte numérique CSS est trop long et est masqué ?
  • Ceci À ce stade, nous pouvons afficher tous les chiffres en configurant le texte pour qu'il soit automatiquement renvoyé à la ligne.

    Si vous souhaitez définir un retour à la ligne automatique, vous devez utiliser l'attribut word-break, qui permet au navigateur de renvoyer à la ligne les lignes à n'importe quel endroit.
  • Exemple :

    rrreee

    Rendu :
  • Que dois-je faire si le texte numérique CSS est trop long et est masqué ?

    Explication : L'attribut
word-break spécifie la méthode de traitement du retour à la ligne automatique.

Syntaxe : word-break: normal|break-all|keep-all;

normal Utilisez les règles de saut de ligne par défaut du navigateur.

break-all Permet les sauts de ligne dans les mots.

keep-all ne peut couper les lignes qu'au niveau des espaces ou des traits d'union à mi-largeur.

Introduction connexe :

En 1990, Tim Berners-Lee et Robert Cailliau inventent conjointement le Web. En 1994, le Web sort véritablement du laboratoire.

Depuis l'invention du HTML, les styles existent sous diverses formes. Différents navigateurs combinent leurs propres langages de style pour permettre aux utilisateurs de contrôler les effets de page. Le code HTML original ne contenait que quelques attributs d'affichage. 🎜🎜Avec la croissance du HTML, afin de répondre aux exigences des concepteurs de pages, HTML a ajouté de nombreuses fonctions d'affichage. Mais à mesure que ces fonctions augmentent, le HTML devient de plus en plus complexe et les pages HTML deviennent de plus en plus volumineuses. C'est ainsi que CSS est né. 🎜🎜Hakun Lee a proposé la proposition originale du CSS en 1994. À l’époque, Bert Bos concevait un navigateur appelé Argo, ils ont donc décidé de concevoir CSS ensemble. 🎜🎜En fait, il y avait quelques suggestions pour unifier les langages de feuilles de style dans l'industrie Internet à cette époque, mais CSS a été le premier langage de feuille de style qui contenait le sens riche de « cascade ». En CSS, les styles d'un fichier peuvent être hérités d'autres feuilles de style. Le lecteur peut utiliser son propre style préféré à certains endroits et hériter ou « cascader » le style de l'auteur à d'autres endroits. Cette approche à plusieurs niveaux donne aux auteurs et aux lecteurs la flexibilité d'ajouter leurs propres conceptions et de mélanger ce que tout le monde aime. 🎜🎜Hakun a proposé CSS pour la première fois lors d'une conférence à Chicago en 1994. CSS a été proposé à nouveau lors de la conférence du réseau www en 1995. Boss a démontré l'exemple du navigateur Argo prenant en charge CSS, et Hakun a également présenté le navigateur Arena avec prise en charge CSS. 🎜🎜La même année, l'organisation W3C (World WideWeb Consortium) a été créée. Tous les membres créatifs CSS sont devenus le groupe de travail du W3C et ont tout mis en œuvre pour développer des normes CSS. Le développement des feuilles de style en cascade était enfin sur la bonne voie. De plus en plus de membres étaient impliqués, comme Thomas Reaxdon de Microsoft, dont les efforts ont finalement conduit à la prise en charge du standard CSS dans le navigateur Internet Explorer. Ha Kun, Persia et d'autres sont les principaux responsables techniques de ce projet. Fin 1996, la première ébauche de CSS a été achevée. En décembre de la même année, la première norme formelle pour les feuilles de style en cascade (Cascading style Sheets Level 1) a été achevée et est devenue une norme recommandée par le w3c. 🎜🎜Début 1997, le groupe de travail du W3C responsable du CSS a commencé à discuter de problèmes non abordés dans la première version. Les résultats des discussions ont constitué la deuxième édition de la spécification CSS publiée en mai 1998. 🎜🎜Recommandations associées : "🎜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:
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
À 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!