Antd -如何为表格行设置圆角边框？
Antd -如何为表格行设置圆角边框？
提问于 2020-11-03 13:29:58
我正在为reactjs应用程序使用antd表。
我在这里创建了Sandbox，以便您进行更改。有没有人能帮我画出像下面这样的圆角边框？
期望值：
我已经尝试添加带有边框相关css的rowClassName={() => "rowClassName1"}，但是边框不会显示出来。
回答 2
Stack Overflow用户
回答已采纳
发布于 2020-11-03 13:57:13
尝试这种方法，
.rowClassName1 td:first-child {
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
}
.rowClassName1 td:last-child {
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
}工作演示:- https://codesandbox.io/s/antd-table-rounded-border-row-forked-9u4x9?file=/src/App.js
Stack Overflow用户
发布于 2020-11-03 14:20:09
@UKS的答案为我解决了这个问题，并且能够制作圆角边框的行。
如果有人想要改变标题样式以及行。
.monitorTableStyle .ant-table-container .ant-table-content table .ant-table-thead tr th:first-child{
border-top-left-radius: 15px !important;
border-bottom-left-radius: 15px !important;
}
.monitorTableStyle .ant-table-container .ant-table-content table .ant-table-thead tr th:last-child{
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/64657247
复制相关文章
相似问题
腾讯云开发者
