英文:
How to add a border radius to a table row element using tailwind
问题
通过添加一个具有以下CSS的空tr,我在行之间留有空间:
.spacer {
height: 15px;
background: transparent;
}
我的表格代码如下:
<table className="text-gray-500 rtl w-full text-center font-inter text-base font-semibold">
<thead className="bg-white text-base text-primary">
<tr>
<td scope="col" className="px-4 py-6">
الرقم
</td>
<td scope="col" className="px-4 py-6">
اسم المشروع
</td>
<td scope="col" className="px-4 py-6">
الحالة
</td>
<td scope="col" className="px-4 py-6">
الدرجة
</td>
<td scope="col" className="px-4 py-6">
التاريخ
</td>
<td scope="col" className="px-4 py-6">
التعديل
</td>
</tr>
</thead>
</table>
英文:
I want my rows to have border radius but it doesn't work , I want it to look like this
I have space between rows by adding an empty tr with this css :
.spacer {
height: 15px;
background: transparent;
}
my table code looks like this :
<table className="text-gray-500 rtl w-full text-center font-inter text-base font-semibold ">
<thead className="bg-white text-base text-primary">
<tr>
<td scope="col" className="px-4 py-6">
الرقم
</td>
<td scope="col" className="px-4 py-6">
اسم المشروع
</td>
<td scope="col" className="px-4 py-6">
الحالة
</td>
<td scope="col" className="px-4 py-6">
الدرجة
</td>
<td scope="col" className="px-4 py-6">
التاريخ
</td>
<td scope="col" className="px-4 py-6">
التعديل
</td>
</tr>
</thead>
</table>
答案1
得分: 2
这个问题之前已经被提出,关于普通的CSS,这是相关的答案,最适用于你的情况。你只需要将这个技巧转换成Tailwind即可。
英文:
The question has been asked before about regular CSS, and this is the answer most applicable to your situation. All you’ll have to do is to translate this technique into Tailwind.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论