美文网首页
【CSS学习笔记20】-position 属性2

【CSS学习笔记20】-position 属性2

作者: 兔小小 | 来源:发表于2023-10-29 23:40 被阅读0次

位置:relative;

元素相对于其正常位置进行定位。position: relative;

设置相对位置元素的 top、right、bottom 和 left 属性将导致 它要调整到远离其正常位置的位置。其他内容不会进行调整以适应 元素。

div.relative {
  position: relative;
  left: 30px;
  border: 3px solid #73AD21;
}

位置:fixed;

元素相对于视口定位,这意味着它始终 即使页面滚动,也会保持在同一位置。top, right、bottom 和 left 属性用于定位元素。position: fixed;

固定元素不会在页面中留下它通常所在的空白。请注意页面右下角的固定元素。

div.fixed {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 300px;
  border: 3px solid #73AD21;
}

相关文章

  • CSS-position-2

    CSS-position系列属性 CSS-position系列属性总结,写记下来,希望对大家有帮助,供新人学习,老...

  • css布局中的定位问题

    CSS position 属性 实例定位 h2 元素: h2 { position:absolute; left...

  • CSS - 定位属性position使用详解(static、re

    position 属性介绍 (1)position 属性自 CSS2 起就有了,该属性规定元素的定位类型。所有主流...

  • css定位

    CSS position属性 CSS display属性 CSS float属性 (引用:https://www...

  • 一些前端布局笔记

    学习学习布局的笔记 1.让padding属性和border属性不增加盒子的大小 2.position属性有:sta...

  • CSS定位网页元素

    position 属性 position 属性与float属性一样,在css排版中都非常重要。position顾名...

  • [note] CSS 定位position|z-index

    内容概述 一. CSS属性 - position CSS属性 - positionstatic:静态定位relat...

  • BFC

    1. CSS定位属性: position 1.1 定义及常见的属性值 1.1.1 定义: position 属性指...

  • CSS position属性和实例应用

    CSS position属性和实例应用

  • CSS position 属性总结

    CSS的position总是属性很容易让人弄混~ 为了仔细区别它们,所以今天总结一下CSS的position属性~...

网友评论

      本文标题:【CSS学习笔记20】-position 属性2

      本文链接:https://www.haomeiwen.com/subject/wgxbidtx.html