zoukankan html css js c++ java

table布局防止table变形 td固定宽度

防止table变形 td固定宽度

具体设置如下代码：

 1 <!doctype html>
 2 <html lang="en">
 3 
 4     <head>
 5         <meta charset="UTF-8" />
 6         <title>防止table变形 td固定宽度</title>
 7         <style type="text/css">
 8             table {
 9                 /*为表格设置合并边框模型*/
10                 border-collapse: collapse;
11                 /*列宽由表格宽度和列宽度设定*/
12                 table-layout: fixed;
13             }
14             
15             td {
16                 border: 1px solid #ddd;
17                 /*允许在单词内换行。*/
18                 word-break: break-word;
19                 /*设置宽度*/
20                 width: 100px;
21             }
22         </style>
23     </head>
24 
25     <body>
26         <table>
27             <tr>
28                 <td>DataDataDataDataDataDataDataDataDataDataDataData123</td>
29                 <td>Data</td>
30                 <td>Data</td>
31                 <td>Data</td>
32             </tr>
33             <tr>
34                 <td>Data</td>
35                 <td>Data</td>
36                 <td>Data</td>
37                 <td>Data</td>
38             </tr>
39         </table>
40     </body>
41 
42 </html>

查看全文

相关阅读:
Linux 套接字编程
 Linux 网络（连接）相关参数作用
 Python WSGI
Ubuntu Cloud Image in Openstack
AWK
MySQL--开发技巧(一)
spring MVC--配置注解
 javascript-JQuery样式篇（一）
JSP--常用标签
 spring MVC basic

原文地址：https://www.cnblogs.com/mengfangui/p/6668405.html

table布局 防止table变形 td固定宽度

table布局防止table变形 td固定宽度