07_06表单Demo2

最新推荐文章于 2021-11-12 09:37:44 发布
原创最新推荐文章于 2021-11-12 09:37:44 发布 · 297 阅读
0 ·
CC 4.0 BY-SA版权
XHTML+CSS 专栏收录该内容
42 篇文章
订阅专栏
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body {
	margin: 0 auto;
}
img {
	border: none;
}
table {
	border-collapse: collapse;
	font: 12px 宋体;
	color: #333333;
}
th,td{padding: 0;}
select,button{ margin: 0;}

.all {
	width: 720px;
	margin: 50px auto;
}
.all .sel {
	
	height: 67px;
	border: 1px solid #e0e0e0;
	border-bottom: none;
}
.all .sel form{ padding-left: 62px;padding-top: 24px; font-size:12px;color:#666666;font-weight:bold;}
.all .sel form select{ width: 105px;height: 18px;}
.all .sel form select.month{margin-left: -4px;}
.all .sel form select.day{margin-left: 7px;}
.all .sel form span.type{margin-left: 28px;}
.all .sel form select.type{margin-left: -4px;}
.all .sel form button{ width: 58px;	height: 23px;margin-left: 28px;}
.all table{width: 720px; border: 1px solid #cccccc;}
.all table th,.all table td{ border:1px solid #cccccc;}
.all table td.type{ height:49px;}
.all table td.type span.putong{padding-left: 185px;}
.all table td.type span.putong img{ padding-right:5px;}
.all table td.type span.zhuanjia{padding-left: 9px;}
.all table td.type span.zhuanjia img{padding-right: 6px;}
.all table td.type span.texu{padding-left: 9px;}
.all table td.type span.texu img{padding-right: 7px;}
.all table td.type span.yejian{padding-left: 9px;}
.all table td.type span.yejian img{padding-right: 6px;}
.all table th{ background:#f7ffef;color:#326801; font-weight:normal;}
.all table th.xm{width: 82px;height: 25px;}
.all table th.ks{width: 78px;}
.all table th.sc{width: 101px;}
.all table th.sj{width: 30px;}
.all table th.yi{width: 48px;}
.all table th.er{width: 48px;}
.all table th.san{width: 49px;}
.all table th.si{width: 49px;}
.all table th.wu{width: 49px;}
.all table th.liu{width: 49px;}
.all table th.ri{width: 49px;}
.all table th.lx{width: 75px;}
.all table td.colMain{height: 77px;}
.all table td.row1_1{height: 25px;}
.all table td.row1_2{height: 26px;}
.all table td.row1_3{height: 24px;}
.all table td.row2_1{height: 26px;}
.all table td.row2_2{height: 24px;}
.all table td.row2_3{height: 25px;}
.all table td.row3_1{height: 25px;}
.all table td.row3_2{height: 25px;}
.all table td.row3_3{height: 25px;}
.all table td.row4_1{height: 25px;}
.all table td.row4_2{height: 25px;}
.all table td.row4_3{height: 25px;}
.all table td.row5_1{height: 25px;}
.all table td.row5_2{height: 25px;}
.all table td.row5_3{height: 25px;}


</style>
</head>

<body>
<div class="all">
  <div class="sel">
    <form action="#">
      <span class="time">出诊时间：</span>
      <select class="month">
        <option value="" selected="selected">--请选择--</option>
        <option value="">1月</option>
        <option value="">2月</option>
        <option value="">...</option>
      </select>
      <select class="day">
        <option value="" selected="selected">--请选择--</option>
        <option value="">1日</option>
        <option value="">2日</option>
        <option value="">...</option>
      </select>
      <span class="type">门诊类型：</span>
      <select class="type">
        <option value="" selected="selected">--请选择--</option>
        <option value="">科室1</option>
        <option value="">科室2</option>
      </select>
      <button>查询</button>
    </form>
  </div>
  <table>
    <tbody>
      <tr>
        <td  class="type" colspan="14"><span class="putong"><img src="img/putong.png" alt=""><span>普通门诊</span></span> <span class="zhuanjia"><img src="img/zhuanjia.png" alt=""><span>专家门诊</span></span> <span class="texu"><img src="img/texu.png" alt=""><span>特需门诊</span></span> <span class="yejian"><img src="img/yejian.png" alt=""><span>夜间门诊</span></span></td>
      </tr>
      <tr>
        <th class="xm">医生姓名</th>
        <th class="ks">所在科室</th>
        <th class="sc">擅长</th>
        <th class="sj"></th>
        <th class="yi">一</th>
        <th class="er">二</th>
        <th class="san">三</th>
        <th class="si">四</th>
        <th class="wu">五</th>
        <th class="liu">六</th>
        <th class="ri">日</th>
        <th class="lx">联系医生</th>
      </tr>
      <tr>
        <td class="colMain" rowspan="3"><span>马雯</span><br />
          副主任医师</td>
        <td rowspan="3">眼科</td>
        <td rowspan="3">视神经、视网膜、脉络膜疾...[详细]</td>
        <td class="row1_1">上</td>
        <td><img src="img/zhuanjia.png" alt=""></td>
        <td></td>
        <td><img src="img/zhuanjia.png" alt=""></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td rowspan="3"></td>
      </tr>
      <tr>
        <td class="row1_2">下</td>
        <td></td>
        <td><img src="img/zhuanjia.png" alt=""></td>
        <td><img src="img/zhuanjia.png" alt=""></td>
        <td></td>
        <td><img src="img/zhuanjia.png" alt=""></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td class="row1_3">晚</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td class="colMain" rowspan="3"><span>刘运良</span><br />
          其他</td>
        <td rowspan="3">神经内科</td>
        <td rowspan="3">临床神经学，脑血管病的...[详细]</td>
        <td class="row2_1">上</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td><img src="img/zhuanjia.png" alt=""></td>
        <td></td>
        <td></td>
        <td rowspan="3"></td>
      </tr>
      <tr>
        <td class="row2_2">下</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td class="row2_3">晚</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td class="colMain" rowspan="3"><span>蒋剑</span><br />
          主治医师</td>
        <td rowspan="3">眼科</td>
        <td rowspan="3"></td>
        <td class="row3_1">上</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td><img src="img/putong.png" alt=""></td>
        <td></td>
        <td></td>
        <td rowspan="3"></td>
      </tr>
      <tr>
        <td class="row3_2">下</td>
        <td></td>
        <td></td>
        <td><img src="img/putong.png" alt=""></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td class="row3_3">晚</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td class="colMain" rowspan="3"><span>何楚峰</span><br />
          主治医师</td>
        <td rowspan="3">耳鼻咽喉科</td>
        <td rowspan="3"></td>
        <td class="row4_1">上</td>
        <td><img src="img/putong.png" alt=""></td>
        <td></td>
        <td><img src="img/putong.png" alt=""></td>
        <td><img src="img/putong.png" alt=""></td>
        <td><img src="img/putong.png" alt=""></td>
        <td></td>
        <td></td>
        <td rowspan="3"></td>
      </tr>
      <tr>
        <td class="row4_2">下</td>
        <td><img src="img/putong.png" alt=""></td>
        <td></td>
        <td></td>
        <td></td>
        <td><img src="img/putong.png" alt=""></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td class="row4_3">晚</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td class="colMain" rowspan="3"><span>吕冰清</span><br />
          其他</td>
        <td rowspan="3">神经内科</td>
        <td rowspan="3">小儿神经病（弱智和脑瘫）</td>
        <td class="row5_1">上</td>
        <td><img src="img/texu.png" alt=""></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td rowspan="3"></td>
      </tr>
      <tr>
        <td class="row5_2">下</td>
        <td></td>
        <td><img src="img/texu.png" alt=""></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td class="row5_3">晚</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
    </tbody>
  </table>
</div>
</body>
</html>