1. 首頁
  2. 問答
  3. 當th文本開始推動表格時，我如何「證明」文本？

當th文本開始推動表格時，我如何「證明」文本？

2015-07-13 45 views
2

當其文本開始推使其獲得更大的是其原始大小當th文本開始推動表格時，我如何「證明」文本？

我想打表‘斷行’（又名證明）表如何證明一個th的文本時，它可以不再擠壓另一個細胞。

原文：

original

現在發生的事情（問題）： problem

如何應該是：（而不是增加寬度，增加高度，並保留全文） should be

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<title>My_Littlest_Table_Shop</title> 
 
    <style> 
 
    table{ 
 
     width: 200px; 
 
     height: 100px; 
 
    } 
 

 
    table, th, td{ 
 
     border: 1px solid black; 
 
    } 
 
    </style> 
 
</head> 
 
<body> 
 
    <table> 
 
    <thead> 
 
    <tr> 
 
     <th class="header" align="center">idkajsdhfkjhaksdfhkjashfkjaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaksdfjjjjjj</th> 
 
     <th class="header" align="center">id</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
     <td class="header" align="center">id</td> 
 
     <td class="header" align="center">id</td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
    <div>----------------200px--------------></div> 
 
</body> 
 
</html>

來源

2015-07-13 Kyle

回答

4

這些人應該做的伎倆：

table { 
    table-layout: fixed; 
} 
th, td { 
    /* not sure if you want this  
    width: 100px; */ 
    word-wrap: break-word; 
} 


<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<title>My_Littlest_Table_Shop</title> 
 
    <style> 
 
    table{ 
 
     width: 200px; 
 
     height: 100px; 
 
    } 
 

 
    table, th, td{ 
 
     border: 1px solid black; 
 
    } 
 
    
 
    table { 
 
     table-layout: fixed; 
 
    } 
 
    th, td { 
 
     /* not sure if you want this  
 
     width: 100px; */ 
 
    
 
     word-wrap: break-word; 
 
    } 
 
    </style> 
 
</head> 
 
<body> 
 
    <table> 
 
    <thead> 
 
    <tr> 
 
     <th class="header" align="center">idkajsdhfkjhaksdfhkjashfkjaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaksdfjjjjjj</th> 
 
     <th class="header" align="center">id</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
     <td class="header" align="center">id</td> 
 
     <td class="header" align="center">id</td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
    <div>----------------200px--------------></div> 
 
</body> 
 
</html>

來源

2015-07-13 13:55:39 franciscod

+0

感謝您幫助我，這是驚人的，我會馬上試試吧+1 – Kyle

1

你需要改變CSS允許字突破和證明文字

table, th, td{ 
    border: 1px solid black; 
    word-break: break-all; 
    text-align: justify; 
}

來源

2015-07-13 13:56:10 FabioG

相關問題

 相關問題