怎么使浮动自适应宽度 改变页面框大小的时候不会往下掉,用position:fixed会不会在不同的分辨率发生错位
<divclass="head-background"><divclass="head-content"><ahref="javascript:;"target="_bl...
<div class="head-background">
<div class="head-content">
<a href="javascript:;" target="_blank" class="logo"><img src="../imgs/logo.png" alt="logo" ></a>
<div class="head-middle">
<div class="type-navigation">
<a href="javascript:;" target="_blank">设为首页</a>
<span>丨</span>
<a href="javascript:;" target="_blank">加入收藏</a>
<span>丨</span>
<a href="javascript:;" target="_blank">新手指南</a>
<span>丨</span>
<a href="javascript:;" target="_blank">站点导航</a>
</div>
</div>
</div>
<div class="clear"></div>
</div>
ccs :.head-background{
width: 100%;
height: 93px;
background-image: url(../imgs/bulletbg.png);
background-repeat: repeat-x;
}
.logo{
float: left;
margin: 9px 30px;
}
.head-content{
margin: 0 auto;
width: 71%;
height: 100%;
}
.head-middle{
float: left;
margin-left: 3px;
width: 67.6%;
height: 90%;
background-image: url(../imgs/head-ico.png);
}
会下掉的地方在head-middle那里
完整的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<title>校翼通</title>
<meta http-equiv="content" content="text-html"; charset="utf-8">
<link rel="stylesheet" type="text/css" href="../css/css-demo.css">
<script type="text/javascript" src="html-js.js" ></script>
</head>
<body class="body">
<!-- 头部设置 -->
<div class="webhead">
<!-- 顶头小导航以及logo设置 -->
+问题发出的代码
css:
.webhead{
width: 100%;
background-image: url(../imgs/jianqiebg.png);
background-repeat: repeat;
}
其余问题里都写了 展开
<div class="head-content">
<a href="javascript:;" target="_blank" class="logo"><img src="../imgs/logo.png" alt="logo" ></a>
<div class="head-middle">
<div class="type-navigation">
<a href="javascript:;" target="_blank">设为首页</a>
<span>丨</span>
<a href="javascript:;" target="_blank">加入收藏</a>
<span>丨</span>
<a href="javascript:;" target="_blank">新手指南</a>
<span>丨</span>
<a href="javascript:;" target="_blank">站点导航</a>
</div>
</div>
</div>
<div class="clear"></div>
</div>
ccs :.head-background{
width: 100%;
height: 93px;
background-image: url(../imgs/bulletbg.png);
background-repeat: repeat-x;
}
.logo{
float: left;
margin: 9px 30px;
}
.head-content{
margin: 0 auto;
width: 71%;
height: 100%;
}
.head-middle{
float: left;
margin-left: 3px;
width: 67.6%;
height: 90%;
background-image: url(../imgs/head-ico.png);
}
会下掉的地方在head-middle那里
完整的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<title>校翼通</title>
<meta http-equiv="content" content="text-html"; charset="utf-8">
<link rel="stylesheet" type="text/css" href="../css/css-demo.css">
<script type="text/javascript" src="html-js.js" ></script>
</head>
<body class="body">
<!-- 头部设置 -->
<div class="webhead">
<!-- 顶头小导航以及logo设置 -->
+问题发出的代码
css:
.webhead{
width: 100%;
background-image: url(../imgs/jianqiebg.png);
background-repeat: repeat;
}
其余问题里都写了 展开
2个回答
2016-12-29
展开全部
用position:absolute
<style type="text/css">
<!--
#help{
width:30px;
height:20px;
background-color:green;
position:fixed;
left:60px;
top:100px;
}
-->
</style>
<style type="text/css">
<!--
#help{
width:30px;
height:20px;
background-color:green;
position:fixed;
left:60px;
top:100px;
}
-->
</style>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询