如何在桌面上只創建圓角

Question

我想知道如何在桌面上創建一個圓角？

附加詳細信息...我想有一個表格的其餘部分是矩形只是第一個標題行應該有圓角。

Answer 1

的問題是，你需要讓某些內部元件輪。

所以你必須爲第一次和最後一輪做出希望的解決方案。

table th:first-child{ 
    border-radius:10px 0 0 10px; 
} 

table th:last-child{ 
    border-radius:0 10px 10px 0; 
} 

Answer 2

如果我們看到您的代碼或至少是不適合您的代碼，那將會更容易幫助您。

無論如何，這似乎教程有關您的問題http://www.jeox.com/docs/manual/web/round_table_corners.html

編輯：或者這一個http://blog.jezmckean.com/css3-rounded-table-corners-no-images/

Answer 3

有多種選擇。這取決於你真正想要達到的目標。

但是請確保border-collapse未設置爲摺疊，因爲這不起作用。欲瞭解更多信息，請參閱該Mozilla鏈接：https://developer.mozilla.org/en/CSS/border-radius

#uno, 
 
#due th, 
 
#tre th { 
 
    border-top-right-radius: 10px; 
 
    border-top-left-radius: 10px; 
 
    border: 1px solid black; 
 
} 
 
#tre td { 
 
    border: 1px solid black; 
 
}

<table id="uno" border="0"> 
 
    <tr> 
 
    <th>Header 1</th> 
 
    <th>Header 2</th> 
 
    </tr> 
 
    <tr> 
 
    <td>row 1, cell 1</td> 
 
    <td>row 1, cell 2</td> 
 
    </tr> 
 
    <tr> 
 
    <td>row 2, cell 1</td> 
 
    <td>row 2, cell 2</td> 
 
    </tr> 
 
</table> 
 

 
<br> 
 

 
<table id="due" border="1"> 
 
    <tr> 
 
    <th>Header 1</th> 
 
    <th>Header 2</th> 
 
    </tr> 
 
    <tr> 
 
    <td>row 1, cell 1</td> 
 
    <td>row 1, cell 2</td> 
 
    </tr> 
 
    <tr> 
 
    <td>row 2, cell 1</td> 
 
    <td>row 2, cell 2</td> 
 
    </tr> 
 
</table> 
 

 
<br> 
 

 
<table id="tre" border="0"> 
 
    <tr> 
 
    <th>Header 1</th> 
 
    <th>Header 2</th> 
 
    </tr> 
 
    <tr> 
 
    <td>row 1, cell 1</td> 
 
    <td>row 1, cell 2</td> 
 
    </tr> 
 
    <tr> 
 
    <td>row 2, cell 1</td> 
 
    <td>row 2, cell 2</td> 
 
    </tr> 
 
</table>