communauté Apprendre Bibliothèque d'outils Loisirs
recherche
Français
Maison > interface Web > tutoriel CSS > css utilise table-layout : corrigé pour définir un exemple de code de largeur égale dans les cellules du tableau

css utilise table-layout : corrigé pour définir un exemple de code de largeur égale dans les cellules du tableau

黄舟
Libérer： 2017-06-30 13:39:18
original
1817 Les gens l'ont consulté

Utilisez table-layout : fixe pour définir la même largeur de cellules du tableau. L'exemple est le suivant : 

<!DOCTYPE>
<html><head><meta charset="utf-8" /><title>设置表格单元格等宽</title><style type="text/css">/*
	
	使字体在所有设备上都达到最佳的显示
*/html { 
	-moz-osx-font-smoothing: grayscale; 
	-webkit-font-smoothing: antialiased; 
	text-rendering: optimizeLegibility; }/*
	给body添加阴影
*/body:before {
	content: "";
	position: fixed;
	top: -10px;
	left: 0;
	width: 100%;
	height: 10px;
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
	-moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
	box-shadow: 0px 0px 10px rgba(0,0,0,.8);
	z-index: 100;}
	/*
	表格单元格等宽
*/
	.calendar { table-layout: fixed; }</style></head><body>

    <table width="100%" border="1" class="calendar">
    	<tr>
        	<td>我在测试我在测试我在测试我在测试我在测试我在测试我在测试我在测试我在测试</td>
            <td>122222222222222</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
        	<td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
        	<td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
        	<td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
    </table></body></html>
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!

Étiquettes associées：
fixed table-layout
source：php.cn
Article précédent：Solution au paramètre de largeur de cellule non valide après avoir défini la disposition de la table : corrigé dans la table CSS Article suivant：CSS : explication détaillée de la disposition des tableaux de mise en page
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
Derniers articles par auteur
Derniers numéros
Comment récupérer les valeurs des lignes non sélectionnées dans un tableau de données HTML à l'aide de jquery J'essaie d'obtenir la valeur de toutes les lignes sur lesquelles le bouton n'a pas été cli...
Depuis 2024-04-05 09:26:49
0
1
1418
Récupérer les valeurs associées imbriquées dans MySQL J'essaie de récupérer des valeurs associées en fonction de plusieurs entrées dans une base...
Depuis 2024-04-04 17:29:06
0
2
365
Comment écouter des événements de clic spécifiques mais en supprimer d'autres ? Mon application Web contient un tableau HTML dans lequel chaque ligne renvoie à une URL sp...
Depuis 2024-04-04 16:55:27
0
1
317
Titre du tableau pivoté verticalement, centré + aligné en bas, multi-navigateur J'ai un tableau avec des en-têtes pivotés qui ressemble à prévu dans Chrome, mais pas dans...
Depuis 2024-04-04 16:45:25
0
1
330
Tableau avec en-tête fixe et en-têtes de colonnes pivotés J'ai un tableau avec un en-tête fixe et une première colonne fixe. Je souhaite également f...
Depuis 2024-04-03 08:50:32
0
1
362
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal