Maison > interface Web > tutoriel CSS > Comment empêcher les mots longs de briser votre mise en page DIV ?

Comment empêcher les mots longs de briser votre mise en page DIV ?

DDD
Libérer: 2024-12-11 06:44:10
original
402 Les gens l'ont consulté

How to Prevent Long Words from Breaking Your DIV Layout?

Empêcher les mots longs de rompre la mise en page Div

Problème :

Les mises en page DIV rencontrent souvent le problème de mots longs s'étendant au-delà des limites du conteneur div, créant un apparence.

Solution :

Trait d'union souple (­) :

Insérer des traits d'union souples à intervalles appropriés pour guider les navigateurs. où casser de longs mots. Les navigateurs affichent généralement les mots avec des traits d'union souples rendus sous forme de mots simples ou avec un trait d'union au milieu du mot.

Élément :

Injecter le élément aux points de rupture potentiels pour indiquer où le mot peut être coupé sans trait d'union.

Courts d'union CSS (auto) :

Cette propriété CSS (prise en charge par IE, Firefox , et Safari) coupe automatiquement les mots en fonction d'un dictionnaire. Cependant, il se peut que cela ne brise pas efficacement tous les mots longs.

Solution rétro-whining :

Appliquer l'affichage : table-cell ; au conteneur div pour imiter le comportement extensible des cellules du tableau.

Débordement avec espace blanc : pré-enveloppement :

Définir le débordement : caché ; et espace blanc : pré-enveloppement ; sur le conteneur div pour forcer les mots à s'écarter de ses limites tout en préservant les caractères d'espacement.

Considérations supplémentaires :

Les navigateurs et les moteurs de recherche ignorent les traits d'union souples et éléments lors de la recherche de texte. Chrome et Firefox les ignorent lors de la copie de texte dans le presse-papiers.

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!

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