HTML 表格 - 列的宽度不变

Question

我尝试调整以下 HTML 表格中的列宽，但没有取得太大成功。背景颜色发生变化，但宽度不变。有什么想法我做错了吗？我尝试了@RonDeVera 建议的方法，但它不起作用：stackOverflow            <table>                <thead>                    <tr>                        <th className="table_ulr"><div className="url_header">URL</div></th>                        <th className="table_content"><div className="content_header">Content</div></th>                    </tr>                </thead>                <tbody>                    {likelyResults.map(i => {                        return (                            <AdvancedLikelyResultItem                                sourceUrl={i.sourceUrl}                                content={i.content}                            />                        );                    })}                </tbody>            </table> CSStable {    width: 100%;}.table_ulr {    width: 30%;    //background-color: orangered;}.table_content {    width: 70%;    //background-color: blue;}.url_header {    left: 12px;    right: 14px;    top: 0px;    font-family: Arial;    font-weight: bold;    font-size: 16px;    line-height: 16px;    letter-spacing: 0.2px;    color: #4d636c;}.content_header {    left: 12px;    right: 14px;    top: 0px;    font-family: Arial;    font-weight: bold;    font-size: 16px;    line-height: 16px;    letter-spacing: 0.2px;    color: #4d636c;}

Answer 1

className通过更改为class和元素<th>来让您的示例正常工作<div>！

然后只需将 css 类更改为所需的宽度即可。