61,112
社区成员
发帖
与我相关
我的任务
分享HTML5+CSS问题，找了半天实在找不出错
本来这个页面已经写好了，很正常的，然后我写其他页面改了下CSS，就出问题了，我训着记忆改了回去，这个页面就这样了，找了一晚上找不出来问题，求大神帮忙看一下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>XXX的个人信息</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<style rel="stylesheet" type="text/css">
body{
margin: 0px;
}
/*div-style*/
#wrapper{
width: 100%;
height: 759px;
}
#header{
width: 100%;
height: 20%;
background-color: #4B4950;
text-align: center;
}
#header h1{
padding:50px 30px 20px 30px;
margin: 0px auto;
color: #a5ffda;
}
#menu{
width: 100%;
height: 8%;
background-color: #6e77b7;
float: left;
}
#left_menu{
width: 17%;
height: 72%;
background-color: #8d9b64;
float: left;
}
#content{
width: 83%;
height: 72%;
color: #d47400;
float: left;
background-color: #5cd7d2;
}
#content h3{
color: #FFFFFF;
}
#menu input[type="button"] {
background-color: #6e77b7;
border:1px solid #6e77b7;
color: white;
font-family: "Trebuchet MS", "Myriad Pro", sans-serif;
font-size: 20px;
font-weight: bold;
padding: 15px 0 15px;
text-align: center;
width: 16.66%;
cursor:pointer;
float: left;
margin: 0 auto;
}
#menu input[type="button"]:hover{
background-color: #818bcf;
border:1px solid #818BCF;
color: black;
font-family: "Trebuchet MS", "Myriad Pro", sans-serif;
font-size: 20px;
font-weight: bold;
padding: 15px 0 15px;
text-align: center;
width: 16.66%;
cursor:pointer;
float: left;
margin: 0 auto;
}
#left_menu input[type="button"] {
background-color: #8d9b64;
border:1px solid #8d9b64;
color: black;
font-family: "Trebuchet MS", "Myriad Pro", sans-serif;
font-size: 20px;
font-weight: bold;
padding: 15px 0 15px;
text-align: center;
width: 100%;
cursor:pointer;
float: inherit;
margin: 0 auto;
}
#left_menu input[type="button"]:hover{
background-color: #a6b775;
border:1px solid #a6b776;
color: white;
font-family: "Trebuchet MS", "Myriad Pro", sans-serif;
font-size: 20px;
font-weight: bold;
padding: 15px 0 15px;;
text-align: center;
width: 100%;
cursor:pointer;
float: inherit;
margin: 0 auto;
}
/*Table Style*/
.tb1{
border: 1px solid #d47400;
width: 100%;
height: 60%;
border-collapse: collapse;
margin: 0px auto;
}
.tb2{
width: 100%;
height: 40%;
border-collapse: collapse;
margin: 0px auto;
float: left;
}
.tb1 caption{
width: 100%;
padding: 15px;
background-color: #c7c7c7;
color: black;
}
tr,td{
border: 1px solid #d47400;
padding: 20px;
}
.tb2 .d1{
width: 6%;
padding: 20px;
}
.r1{
background-color: #e7e7e7;
}
.r2{
background-color: #d7d7d7;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<h1>OA协同办公系统</h1>
</div>
<div id="menu">
<div class="schedule">
<a href="schedule.html"><input type="button" value="日程安排"></a>
<div class="clear"></div>
</div>
<div class="userinfo">
<a href="userinfo.html"><input type="button" value="个人信息"></a>
<div class="clear"></div>
</div>
<div class="cardholder">
<a href=""><input type="button" value="名片夹"></a>
<div class="clear"></div>
</div>
<div class="addrlist">
<a href=""><input type="button" value="公司通讯录"></a>
<div class="clear"></div>
</div>
<div class="myfolder">
<a href=""><input type="button" value="个人文件夹"></a>
<div class="clear"></div>
</div>
<div class="onlineinfo">
<a href=""><input type="button" value="在线信息"></a>
<div class="clear"></div>
</div>
</div>
<div id="left_menu">
<div class="modify">
<a href="infomodify.html"><input type="button" value="个人信息修改" onclick=""></a>
<div class="clear"></div>
</div>
<div class="query">
<a href=""><input type="button" value="搜索其他用户" onclick=""></a>
<div class="clear"></div>
</div>
</div>
<div id="content">
<table class="tb1">
<caption>XXX的个人信息</caption>
<tr class="r1">
<td>员工号：</td>
<td>姓名：</td>
</tr>
<tr class="r2">
<td>性别：</td>
<td>年龄：</td>
</tr>
<tr class="r1">
<td>所属部门：</td>
<td>职位：</td>
</tr>
<tr class="r2">
<td>兴趣爱好：</td>
<td>移动电话：</td>
</tr>
<tr class="r1">
<td>电子邮件：</td>
<td>固定电话：</td>
</tr>
<tr class="r2">
<td>系统角色：</td>
<td>密码：</td>
</tr>
</table>
<table class="tb2">
<tr class="r1">
<td class="d1">个人介绍:</td>
<td></td>
</tr>
</table>
</div>
</div>
</body>
</html>
...全文
请发表友善的回复…
发表回复
Msxindl_Com 2017-05-11
- 打赏
- 举报
/*tr,*/td{ /*修改这里*/
border: 1px solid #d47400;
padding: 20px;
}
.tb2>tr,td{ /*添加到这里*/
border-top:none;
}
Msxindl_Com 2017-05-11
- 打赏
- 举报
1、需要修改的部分：
.tb2{
width: 100%;
height: 40%;
border-collapse: collapse;
margin: 0px auto;
/*float: left;*/
}
.tb1 caption{
/*width: 100%;*/
padding: 15px;
background-color: #c7c7c7;
color: black;
}
.tb2>tr,td{
border-top:none;
}
___紫菜 2017-05-11
- 打赏
- 举报
.tb1 caption {
width: 100%;
/* padding: 15px; */
background-color: #c7c7c7;
color: black;
height: 50px;
line-height: 50px;
}___紫菜 2017-05-11
- 打赏
- 举报
什么问题呢？不说明白怎么帮你呢、
看着是个昵称 2017-05-11
- 打赏
- 举报
你原先的效果是什么样子的？@qq_33271984
夏日不浪漫 2017-05-11
- 打赏
- 举报
辣姐什么鬼 2017-05-11
- 打赏
- 举报
额，不知道你的问题是什么，我看着唯一不和谐的也就是上面的table和下面的个人介绍没对齐，如果是解决这个
/*Table Style*/
.tb1{
border: 1px solid #d47400;
width: 100%;
height: 60%;
border-collapse: collapse;
margin: 0px auto;
}
把这里面你写的margin:0px auto;去掉就行
如果不是，建议贴出你的具体问题
