position定位问题

时间 2019-12-06

标签 position 定位问题栏目 CSS 繁體版

原文原文链接

position属性规定了元素的定位类型，默认为static。
该属性还能够有下值：
absolute：生成绝对定位的元素，相对于 static 定位之外的第一个父元素进行定位。
fixed：生成绝对定位的元素，相对于浏览器窗口进行定位。
relative：生成相对定位的元素，相对于其正常位置进行定位。
inherit：规定应该从父元素继承 position 属性的值。web

  <style>
      
      body{
          height: 2000px  /*这里将body的高度设置为2000px是为了区分absolute和fixed的差异*/
      }
      .test-div{
          position:fixed;
          left:50px;
          top:50px
      }
 
      .out-div{
          width: 300px;
          height: 300px;
          background: purple;  /*这里定义个背景，让咱们知道这个div在哪*/
          margin:50px 0px 0px 50px;
          position: relative
      }
      .in-div{
          position:absolute;
          left:50px;
          top:50px
      }
  </style>
  <body>
  <div class="test-div">Hello World</div>
  <div class="out-div">
      <div class="in-div">Hello World</div>
  </div>
    </body>

1. html中position定位问题
2. CSS position: absolute、relative定位问题详解
3. html关于position定位问题
4. css定位position
5. CSS Position（定位）
6. css-定位（position）
7. CSS3 定位| Position
8. Position定位
9. position定位
10. CSS定位(position)
更多相关文章...
• Markdown 标题 - Markdown 教程
• jQuery Mobile 主题 - jQuery Mobile 教程
• PHP Ajax 跨域问题最佳解决方案
• IntelliJ IDEA中SpringBoot properties文件不能自动提示问题解决