Conseils pour réaliser un retour à la ligne automatique lors de la création de pages Web CSS
Auteur:Eve Cole
Date de mise à jour:2025-01-15 17:00:16
Conseils pour réaliser un retour à la ligne automatique lors de la création de pages Web CSS Vendredi 6 mars 2009 10:47 Tout le monde sait que l'anglais ou les chiffres continus peuvent faire agrandir le conteneur et ne peuvent pas être automatiquement renvoyés en fonction de la taille du conteneur. Voici comment les envelopper. en utilisant la méthode CSS!
Pour div 1. (navigateur IE) white-space:normal; word-break:break-all, le premier suit ici la norme. #wrap{espace blanc:largeur normale:200px;
ou
#wrap{word-break:break-all;width:200px;}eg.<div id="wrap">ddd111111111111111111111111111111</div>Effet : le retour à la ligne peut être obtenu 2. (navigateur Firefox) white-space:normal; word -break:break-all;overflow:hidden; De même, il n'y a pas de bonne méthode d'implémentation dans FF. Vous pouvez uniquement masquer ou ajouter des barres de défilement. Bien sûr, il est préférable de ne pas ajouter de barres de défilement ! #wrap{espace blanc:normal; largeur:200px; débordement:auto;}
ou
#wrap{word-break:break-all;width:200px; overflow:auto; }eg.<div id="wrap">ddd11111111111111111111111111111</div> Effet : Le conteneur est normal et le contenu est masqué pour la table 1. (navigateur IE) utilisez le style table-layout:fixed;
par exemple.<style>
.tb{table-layout:fixe}
</style><table class="tbl" width="80">
<tr>
<td>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>Effet : Peut renvoyer à la ligne les lignes 2. (Navigateur IE) Utilisez le style table-layout : fixe et nowrapeg.<style>
.tb {table-layout:fixed}
</style><table class="tb" width="80">
<tr>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>Effet : peut envelopper 3. (navigateur IE) utilisez le style table-layout:fixed et nowrap<style> lorsque vous utilisez le pourcentage pour corriger la taille du td http://www.knowsky.com/
.tb{table-layout:fixe}
</style><table class="tb" width=80>
<tr>
<td width=25% nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table> Effet : les deux td s'enroulent normalement. 3. (Navigateur Firefox) Lorsque vous utilisez le pourcentage pour fixer la taille du td, utilisez les styles table-layout : fix et nowrap, et utilisez diveg.<style>.
.tb {table-layout:fixed}
.td {débordement : caché ;}
</style><table class=tb width=80>
<tr>
<td width=25% class=td nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</td>
<td class=td nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</td>
</tr>
</table> La largeur de la cellule ici doit être définie en pourcentage. L'effet est : affichage normal, mais pas de retour à la ligne (Remarque : il n'existe pas de bon moyen d'envelopper le contenu du conteneur sous FF. Vous pouvez uniquement utiliser le débordement pour masquer le surplus. contenu pour éviter d'affecter l'effet global)