Blogger Information
Blog 48
fans 2
comment 3
visits 37872
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
3月22日作业
黑猫警长的博客
Original
458 people have browsed it

CSS代码

实例

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>家政员信息表</title>
<style>
	table,tr,th,td{ border:1px solid #555; margin: 0; padding: 0;}
	table{box-shadow: 5px 5px 5px #888; border-collapse: collapse; text-align: center; width:98%; margin:0 auto; background: url(../images/tab_bg.png) no-repeat;}
	th{ padding:10px 12px 10px 12px;background:rgba(173,216,230,0.5); color:red}
	td{padding:5px 5px}
	caption{font-size:1.2em;}
	caption small{ font-size:0.5em; margin-left:2%;}
	.headpic img{border-radius:50%;box-shadow:3px 3px 3px #666;}
	
	</style>
</head>

<body><table>
  <caption><h2>订单管理<small><a href="">添加</a></small></h2></caption>
  <tbody>
    <tr align="center">
     <th>订单号</th>
     <th>姓名</th>
     <th>籍贯</th>
     <th>学历</th>
     <th>出生日期</th>
     <th>婚姻状况</th>
     <th>身份证号码</th>
     <th>意向工作</th>
     <th>工作经验</th>
     <th>实名认证</th>
     <th>所属公司</th>
     <th>照片</th>
     <th>状态</th>
     <th colspan="2">操作</th>
    </tr>
    <tr align="center">
      <td>1</td>
      <td>江伊帆</td>
      <td>广东</td>
      <td>中专</td>
      <td>1995-05-10</td>
      <td>未婚</td>
      <td>4401**19950510****</td>
      <td> 育婴师/早教 </td>
      <td>1</td>
      <td><img src="../images/SFZcredit.png" alt="已实名" title="已实名"></td>
      <td>金贝家政连锁服务机构</td>      
      <td class="headpic"><img src="../images/1.jpg" height="80"></td>
      <td>已派单</td>
      <td><a href="">编辑</a></td>
      <td><a href="">删除</a></td>
    </tr>
    <tr align="center">
      <td>1</td>
      <td>江伊帆</td>
      <td>广东</td>
      <td>中专</td>
      <td>1995-05-10</td>
      <td>未婚</td>
      <td>4401**19950510****</td>
      <td> 育婴师/早教 </td>
      <td>1</td>
      <td><img src="../images/SFZcredit_no.png" alt="未实名" title="未实名"></td>
      <td>金贝家政连锁服务机构</td>      
      <td class="headpic"><img src="../images/2.jpg" height="80"></td>
      <td>未派单</td>
      <td><a href="">编辑</a></td>
      <td><a href="">删除</a></td>
    </tr>
    <tr align="center">
      <td>1</td>
      <td>江伊帆</td>
      <td>广东</td>
      <td>中专</td>
      <td>1995-05-10</td>
      <td>未婚</td>
      <td>4401**19950510****</td>
      <td> 育婴师/早教 </td>
      <td>1</td>
      <td><img src="../images/SFZcredit.png" alt="已实名" title="已实名"></td>
      <td>金贝家政连锁服务机构</td>      
      <td class="headpic"><img src="../images/3.jpg" height="80"></td>
      <td>已派单</td>
      <td><a href="">编辑</a></td>
      <td><a href="">删除</a></td>
    </tr>
    <tr align="center">
      <td>1</td>
      <td>江伊帆</td>
      <td>广东</td>
      <td>中专</td>
      <td>1995-05-10</td>
      <td>未婚</td>
      <td>4401**19950510****</td>
      <td> 育婴师/早教 </td>
      <td>1</td>
      <td><img src="../images/SFZcredit.png" alt="已实名" title="已实名"></td>
      <td>金贝家政连锁服务机构</td>      
      <td class="headpic"><img src="../images/4.jpg" height="80"></td>
      <td>已派单</td>
      <td><a href="">编辑</a></td>
      <td><a href="">删除</a></td>
    </tr>
    <tr align="center">
      <td>1</td>
      <td>江伊帆</td>
      <td>广东</td>
      <td>中专</td>
      <td>1995-05-10</td>
      <td>未婚</td>
      <td>4401**19950510****</td>
      <td> 育婴师/早教 </td>
      <td>1</td>
      <td><img src="../images/SFZcredit_no.png" alt="未实名" title="未实名"></td>
      <td>金贝家政连锁服务机构</td>      
      <td class="headpic"><img src="../images/5.jpg" height="80"></td>
      <td>未派单</td>
      <td><a href="">编辑</a></td>
      <td><a href="">删除</a></td>
    </tr>
  </tbody>
</table>

</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

微信图片_20180323182132.png


Correction status:qualified

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!