Pourquoi `overflow: Hidden` ne fonctionne-t-il pas sur un `` élément pour tronquer le texte ?

Débordement caché inefficace dans ?

Problème :
Un la cellule destinée à avoir une largeur fixe déborde de texte en excès, élargissant les limites de la cellule.

Solution :
Pour appliquer la troncature du texte dans la cellule, une combinaison de propriétés CSS est requise.

1. disposition de la table : fixe

   • Garantit que la largeur du tableau reste statique.

2. débordement : caché sur

   • Peaux débordantes text.

3. white-space: nowrap on

   • Empêche le texte de s'enrouler dans la cellule.

Exemple (Colonne à largeur fixe) :

 box-sizing : border-box;<br>}<br>table {<br> table-layout : fixe ;<br> border-collapse : réduire;<br> largeur : 100%;<br> largeur maximale : 100px;<br>}<br>td {<br> arrière-plan : #F00;<br> remplissage : 20px;<br> débordement : caché;<br> espace blanc : nowrap;<br> largeur : 100px;<br> bordure : solide 1px #000;<br>}

 <tbody></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><tr>
  <td>
    This_is_a_terrible_example_of_thinking_outside_the_box.
  </td>
</tr>
<tr>
  <td>
    This_is_a_terrible_example_of_thinking_outside_the_box.
  </td>
</tr>

Copier après la connexion

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!