淘宝考题

Javascripters 2011-05-25 02:02:45

页面body下有个div,无论窗口如何resize,该div永远离窗口上下左右各20像素，div背景色#ccc，纯css解决（最高得20分），js解决（最高得10分）。

无聊给大家消磨时间。

...全文

200 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

潮起潮落 2011-05-25

打赏
举报

[Quote=引用 5 楼 storm0 的回复:]

代码如下：

HTML code

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>test</title>
<meta name="author" content="Joy Du(椋橀浂闆鹃洦), dooyoe@gmail.com" />
<meta name="copyright" c……
[/Quote]
可以兼容IE6。

飘零雾雨 2011-05-25

打赏
举报

代码如下：



<!DOCTYPE html>

<html lang="zh-cn">

<head>

<meta charset="utf-8" />

<title>test</title>

<meta name="author" content="Joy Du(椋橀浂闆鹃洦), dooyoe@gmail.com" />

<meta name="copyright" content="www.doyoe.com" />

<style>

html,body{margin:0;padding:0;}

html{_padding:20px;}

body{height:100%;}

.test{position:absolute;top:20px;right:20px;bottom:20px;left:20px;_position:static;_width:100%;_height:100%;background:#ddd;}

</style>

</head>

<body>

<div class="test">璺漺indow涓婂彸涓嬪乏鍚?0px</div>

</body>

</html>

zhangshaolongjj 2011-05-25

打赏
举报

<html>

<head>

<style type="text/css">

*{

	margin:0;

	padding:0;

	border:0;

}

#d{

	background:#ccc;

	position:absolute;

	top:20px;

	left:20px;

	right:20px;

	bottom:20px;

}

</style>

</head>

<body>

<div id="d"></div>

</body>

</html>

henrycomein 2011-05-25

打赏
举报



<html>

<head></head>

<body style="margin:0;padding:0">

<div id="testDiv" style="background-color:#ccc;position:relative"></div>



</body>



</html>

<script>

function setDiv(){

			var oDiv=document.getElementById('testDiv');

			var height = document.documentElement.offsetHeight;

			var width = document.documentElement.offsetWidth;

			oDiv.style.left=20+'px';

			oDiv.style.top=20+'px';

			oDiv.style.width= (width-40)+'px'

			oDiv.style.height= (height-40)+'px'

}	

	window.onload=setDiv;

	window.onresize=setDiv;	



</script>