HTML5+CSS如何让子DIV居右并不脱离全局div控制,具体情况如下
我现在设置的是:全局DIV只设置500宽度,这样更小的子DIV可以在全局DIV里面存在,并随全局DIV动,如果页面缩小到全局DIV宽度以下,就不随动了,子DIV的内容就被...
我现在设置的是:全局DIV只设置500宽度,这样更小的子DIV可以在全局DIV里面存在,并随全局DIV动,如果页面缩小到全局DIV宽度以下,就不随动了,子DIV的内容就被浏览器边框遮过去了。现在的具体要求是子DIV要在整个浏览器居右并随右边框动,并且不能脱离全局控制,也就是说缩小到全局DIV时,子DIV又不随着浏览器边框动了
展开
2个回答
展开全部
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>标题</title>
<link rel="stylesheet" href="css/reset.css">
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<style type="text/css">
.box {
position: relative;
width: 500px;
height: 300px;
margin: 100px 0 0 300px;
border: 1px solid #9a9a9a;
}
.scol {
position: fixed;
right: 0;
top: 100px;
width: 100px;
height: 100px;
background: #faa;
}
</style>
</head>
<body>
<div class="wrap">
<div class="box">
<div class="scol">
</div>
</div>
</div>
<script type="text/javascript">
$(window).resize(function() {
// console.log($(window).width());
if ($(window).width() <= 800) {
$('.scol').css({
'position': 'absolute'
})
};
})
</script>
</body>
</html>
其实就是判断浏览器窗口的宽度是不是已经缩小到大div,如何已经缩小到大div了就把小div的定位从相对于浏览器窗口来定位换成绝对定位来弄。如果还不懂可以加我QQ:646488796
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
总觉得怪怪的,是我理解有误么
<style type="text/css">
.t{min-width:500px;height:600px;border:1px solid red;}
.t .t2{float:right;border:1px solid green;margin:5px;width:120px;height:500px;}
</style>
<div class="t">
<div class="t2"></div>
</div>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询