html5制作时上层div挡住了下面的怎么解决
<!DOCTYPEhtml><html><head><metacharset="utf-8"/><title></title><styletype="text/css">...
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
.shouhang{
color: white;
size: a3;
font-size: 15px;
font-weight: bold;
}
.inline_div{
position: absolute;
display: inline;
}
#d1,#d2{
height: 40px;
background-color: black;
color: #c8c8c8;
font-size: 30px;
margin-left: 0px;
margin-bottom:1px ;
}
#d1
{
width: 30%;
}
#d2{
left: 40%;
width: 70%;
font-size: 15px;
color: white;
}
body{
padding: 0px;
margin: 0px;
}
.dibu{
color: white;
}
</style>
</head>
<body>
<table bgcolor="#171717"width="100%"border="0"height="10">
<tr class="shouhang"align="center">
<td>个人及家用产品</td>
<td>最新活动</td>
<td>商用产品</td>
<td>服务支持</td>
<td>华硕官方商城</td>
<td><h6>登录</h6></td>
<td><input type="text"name="search"size="10"></td>
</tr>
</table>
<div id="d1"class="inline_div">ROG STRIX-GTX1080-O8G-GAMING</div>
<div id="d2"class="inline_div">产品概述 产品规格 产品图库 评论 服务与支持</div>
<table bgcolor="black"width="100%">
<tr>
<td>华硕猛禽 ROG Strix GeForce® GTX 1080 游戏显卡</td>
</tr>
</table>
</body>
</html> 展开
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
.shouhang{
color: white;
size: a3;
font-size: 15px;
font-weight: bold;
}
.inline_div{
position: absolute;
display: inline;
}
#d1,#d2{
height: 40px;
background-color: black;
color: #c8c8c8;
font-size: 30px;
margin-left: 0px;
margin-bottom:1px ;
}
#d1
{
width: 30%;
}
#d2{
left: 40%;
width: 70%;
font-size: 15px;
color: white;
}
body{
padding: 0px;
margin: 0px;
}
.dibu{
color: white;
}
</style>
</head>
<body>
<table bgcolor="#171717"width="100%"border="0"height="10">
<tr class="shouhang"align="center">
<td>个人及家用产品</td>
<td>最新活动</td>
<td>商用产品</td>
<td>服务支持</td>
<td>华硕官方商城</td>
<td><h6>登录</h6></td>
<td><input type="text"name="search"size="10"></td>
</tr>
</table>
<div id="d1"class="inline_div">ROG STRIX-GTX1080-O8G-GAMING</div>
<div id="d2"class="inline_div">产品概述 产品规格 产品图库 评论 服务与支持</div>
<table bgcolor="black"width="100%">
<tr>
<td>华硕猛禽 ROG Strix GeForce® GTX 1080 游戏显卡</td>
</tr>
</table>
</body>
</html> 展开
1个回答
展开全部
大哥，你给div定位了，所以，这个定位的div，就不按照顺序排了。
<style>
.inline_div{display: inline;}
</style>
<div class="inline_w">
<div id="d1"class="inline_div">ROG STRIX-GTX1080-O8G-GAMING</div>
<div id="d2"class="inline_div">产品概述 产品规格 产品图库 评论 服务与支持</div>
</div>
<style>
.inline_div{display: inline;}
</style>
<div class="inline_w">
<div id="d1"class="inline_div">ROG STRIX-GTX1080-O8G-GAMING</div>
<div id="d2"class="inline_div">产品概述 产品规格 产品图库 评论 服务与支持</div>
</div>
更多追问追答
追问
怎么解决呢
追答
inline_div已经把他的position定位给去掉了呀
然后按照我写的替换掉
两个表格之间插入
ROG STRIX-GTX1080-O8G-GAMING
产品概述 产品规格 产品图库 评论 服务与支持
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
