我想保留不同寬度的不同列。我嘗試用多種方式更改它，包括更改特定 td/th 的寬度。但寬度屬性在我的代碼中不起作用。Table div 也包含overflow 屬性。但我無法找到為什么無法使用內聯樣式或使用 nth-child 屬性更改寬度。請幫我解決這個問題。 <!DOCTYPE html> <html> <head> <style>.table-div{ overflow-x:auto; overflow-y:auto; margin-bottom: 100px; margin-top: 100px; max-height: 300px;" border: 2px blue;}.lesswidth{ width: 500px;}.fixedwidth{ width: 150px; }table { /*table-layout: fixed;*/ /* width: 100%;*/ /* max-height: 100px;*/ /*border-collapse: collapse;*/ border-spacing: 0; border: 1px solid red; display: block; /*margin-bottom: 100px;*/}th{ /*display: block;*/ border: 1px solid red; position: sticky; top:0; text-align: left; padding: 10px; color:black; width: 200px; background-color: #f2f2f2;}td{ /*display: block;*/ border: 1px solid red; /*text-align: left;*/ padding: 10px; color:black; background-color: #f2f2f2; width: 200px; /*margin: 100px 0px 75px 100px;*/ /*margin-right: 100px;*/}/*td:nth-child(2) { width: 100px !important; }tr:nth-child(even){ background-color: red !important;*/}/*tr:nth-child(even){background-color: #f2f2f2}*/</style> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="resCSS.css"> </head> <body> <div class="container"> <div class="table-div"> <table> <!-- class="tablecolor" --> <tr> <th class="fixedwidth">NUMBER</th> <th>TYPE OF VACCINE</th> <th>RELATED USECASE</th> <th>DEVELOPER/RESEARCHER</th> <th>CURRENT STAGE</th> <th>FUNDING SOURCES</th> <th>CLINICAL TRIALS</th> <th>ANTICIPATED NEXT STEPS</th> <th>PUBLISHED RESULTS</th> <th>SOURCES</th> </tr> </table></div> </div><!-- container --> </body> </html>
- 1 回答
- 0 關注
- 185 瀏覽
添加回答
舉報
0/150
提交
取消