css3表格练习

1.效果图

2.html

获奖名单
中奖用户PR排名具体奖品王振民1一年学费+特别礼品王振民1一年学费+特别礼品王振民1一年学费+特别礼品王振民1一年学费+特别礼品王振民1一年学费+特别礼品王振民1一年学费+特别礼品<!-- 总计共100名 -->

3.css

*{padding: 0;margin: 0;list-style-type: none;}.line{width: 330px;height: 1px;border-top: 1px solid #7ef805;margin: 0 auto;margin-top: 50px;}h3{width: 100px;text-align: center;/* 关键点,利用定位让文字居中 */position: relative;margin: 0 auto;bottom: 14px;background-color: white;color: #7ef805;}table{width: 330px;/* margin: 0 auto;居中 */margin: 0 auto; text-align: center;vertical-align: middle;}table tr td{/* width: 10%; */height: 50px;}/* 去除表格四周边框 */table td{border: 1px solid blue;/* 上边框和左边框为0 */border-top: 0;border-left: 0;}table td:nth-child(3){border-right: 0;}/* 站在父元素的角度上选择最后一个子元素 */table tbody tr:last-child td{border-bottom: 0;}thead{background-color: #7ef805;color: white;}.warp{/* font-size: 10px; */font-weight: bolder;}/* 隔行变色 */tbody tr:nth-child(odd){background-color: #7ef805;}tbody tr:nth-child(even){background-color: red;}tbody tr{border: 1px solid red;}