欢迎访问我的的博客,网站主要用于记录学习WEB语言|CMS建站|SEO优化及日常工作常见问题总结!
您的位置:主页 > HTML/CSS >

定位之固定定位

固定定位- position: fixed

  1. 脱离文档流;
  2. 参照物是浏览器的可视窗口;任何元素都可以设置固定定位;
  3. 可设置top/ bot tom/left/ right四个方位
  4. 可通过z-index改变层级
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
/*
固定定位特点
1.会脱离文档流
2.可以设置上下左右四个方位
如果向时设置top和 bottom值只有top起作用
如果同时设置了1eft和riht值只有1eft起作用
3.参照物:整个浏览器窗口
4.可以设置z-index改变层级值越大越在上
*/
*{
margin: 0;
padding: 0;
}
.header{
width: 100%;
height: 100px;
background-color: #333;
position: fixed;
left: 0;
bottom: 0;
}
</style>
</head>
<body>
<div class="header"></div>
<div style="height: 2000px;"></div>
</body>
</html>
上一篇标题:定位元素的异同点
下一篇标题:定位之相对定位

相关文章

 

文章-定位之固定定位发布日期:2021-04-01 17:26作者:admin
如需转载,请注明文章出处和来源网址:https://www.dhnblog.com/htmlcss/261.html