固定定位。

最新推荐文章于 2024-05-04 13:53:08 发布

数数huhu

最新推荐文章于 2024-05-04 13:53:08 发布

阅读量50

点赞数

文章标签： html css

本文链接：https://blog.csdn.net/qq_51942661/article/details/117754960

版权

此处保存的是我学习前端的笔记和一些日常练习，放在这里方便查看。成长之路难免会有错误，这时候才形象生动的体现那句经典名言：“失败是成功之母！” 哈哈哈哈...... 话不多说。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>固定定位</title>
		<style type="text/css">
		.box1{
			width: 200px;
			height: 200px;
			background-color: #CC0000;
		}
		.box2{
			width: 200px;
			height: 200px;
			background-color: #6495ED;
			/* ifxed:(立马想到小广告！)
			1.它与绝对定位大部分特点的都是相同的
			不同的是：
					固定定位永远是相对于浏览器窗口进行定位的
					固定在浏览器窗口的你个位置，不会随滚动条滚动
			IE6不支持固定定位（Js）
			  */
			position: fixed;
			left: 0px;
			top: 0px;
		}
		.box3{
			width: 200px;
			height: 200px;
			background-color: #008000;
		}
		
		</style>
	</head>
	<body style="height: 5000px;">
		<div class="box1"></div>
		<div class="box4" style="width: 300px; height: 300px; background-color: #FFA500;">
			<div class="box2"></div>
		</div>
		<div class="box3"></div>
	</body>
</html>

数数huhu

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
固定定位。

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>固定定位</title> <style type="text/css"> .box1{ width: 200px; height: 200px; background-color: #CC0000; } .box2{ width: 200px; ...
复制链接

扫一扫