CSS基础之固定定位

最新推荐文章于 2022-12-08 14:08:18 发布

Andone_hsx

最新推荐文章于 2022-12-08 14:08:18 发布

阅读量494

点赞数

分类专栏： CSS基础文章标签： css html 标签

本文链接：https://blog.csdn.net/Andone_hsx/article/details/54318920

版权

CSS基础专栏收录该内容

10 篇文章 0 订阅

订阅专栏

固定定位
1、什么是固定定位
将元素固定在网页的可视化的某个位置处，不会随着滚动条而发生位置的改变
2、属性 & 值
position:fixed;
通过偏移属性实现位置的调整
top/right/bottom/left
3、注意
1、固定定位元素会脱离文档流
2、固定定位元素会变成块级元素

3、固定定位元素永远都是相对于body实现位置的初始化

效果如下图所示：

<!doctype html>
<html>
	<head>
		<title>Insert your title</title>
		<meta charset="utf-8">
		<style>
			#menu{
				width:30px;
				height:150px;
				background-color:red;
				position:fixed;
				right:0px;
				top:300px;
			}
		</style>
	</head>
	<body>
		<div id="menu"></div>
		<div style="height:5000px;"></div>
	</body>
</html>

Andone_hsx

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS基础之固定定位

固定定位1、什么是固定定位将元素固定在网页的可视化的某个位置处，不会随着滚动条而发生位置的改变2、属性 & 值position:fixed;通过偏移属性实现位置的调整top/right/bottom/left3、注意1、固定定位元素会脱离文档流2、固定定位元素会变成块级元素3、固定定位元素永远都是相对于body实现位置的初始化效果如下图所示：
复制链接

扫一扫