九月六号作业

圆角表格

<div id="table_wrap">
    <table class="table" width="800" cellspacing="0" cellpadding="0">
        <thead class="table_head">
        <tr>
            <th>头部1</th>
            <th>头部2</th>
            <th>头部3</th>
            <th>头部4</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td>1内容1</td>
            <td>1内容2</td>
            <td>1内容3</td>
            <td>1内容4</td>
        </tr>
        <tr>
            <td>2内容1</td>
            <td>2内容2</td>
            <td>2内容3</td>
            <td>2内容4</td>
        </tr>
        <tr>
            <td>3内容1</td>
            <td>3内容2</td>
            <td>3内容3</td>
            <td>3内容4</td>
        </tr>
        </tbody>
    </table>
    <style>
        #table_wrap > table{
            font-size: 20px;
            text-align: center;
            margin: auto;
            border-collapse: separate;+
        }
        #table_wrap > table >thead th{
            border: 1px solid slategrey;
        }
        #table_wrap > table >tbody tr td{
            border: 1px solid slategrey;
        }
        #table_wrap > table >thead th:first-of-type{
            border-top-left-radius: 20px;
        }
        #table_wrap > table >thead th:last-of-type{
            border-top-right-radius: 20px;
        }
        #table_wrap > table > tbody tr:last-child td:first-child{
            border-bottom-left-radius: 20px;
        }
        #table_wrap > table >tbody tr:last-child td:last-of-type{
            border-bottom-right-radius: 20px;
        }
    </style>
</div>

效果图：

伪类选择器：

 伪类选择器：

 E:first-child { sRules }        匹配父元素的第一个子元素E。 

 E:last-child { sRules }      匹配父元素的最后一个子元素E。

 E:only-child { sRules }      匹配父元素仅有的一个子元素E。 

E:nth-child(n) { sRules }    匹配父元素的第n个子元素E，假设该子元素不是E，则选择符无效。

 E:nth-last-child(n) { sRules }      匹配父元素的倒数第n个子元素E，假设该子元素不是E，则选择符无效。 

 E:first-of-type     匹配同类型中的第一个同级兄弟元素E。 

 E:last-of-type { sRules }       匹配同类型中的最后一个同级兄弟元素E。 

 E:only-of-type { sRules }       匹配同类型中的唯一的一个同级兄弟元素E。 

 E:nth-of-type(n)        匹配同类型中的第n个同级兄弟元素E。 

 E:nth-last-of-type(n) { sRules }        匹配同类型中的倒数第n个同级兄弟元素E。 

 E:last-of-type { sRules }     匹配同类型中的最后一个同级兄弟元素E。