標籤：rod head rip ack image 預設值 繼承 class log
一：Css1.1：position定義和用法position 屬性規定元素的定位類型。
可能的值| 值 | 描述 |
|---|---|
| absolute | 產生絕對位置的元素，相對於 static 定位以外的第一個父元素進行定位。 元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。 |
| fixed | 產生絕對位置的元素，相對於瀏覽器視窗進行定位。 元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。 |
| relative | 產生相對定位的元素，相對於其正常位置進行定位。 因此，"left:20" 會向元素的 LEFT 位置添加 20 像素。 |
| static | 預設值。沒有定位，元素出現在正常的流中（忽略 top, bottom, left, right 或者 z-index 聲明）。 |
| inherit | 規定應該從父元素繼承 position 屬性的值。 |
查看完整代碼
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> .box { border:1px solid #f60; width:100px; height:100px; margin:0 auto; -webkit-border-radius:50px; -moz-border-radius:50px; -o-border-radius:50px; border-radius:50px; } </style></head><body> <div style="position: relative;width: 500px;height: 300px;border: 2px solid red;margin:0 auto"> <div style="position: absolute;width: 50px;height: 50px;background-color: black;left: 0;bottom: 0"></div> <div style="position: absolute;width: 50px;height: 50px;background-color: blue;right: 0;bottom: 0"></div> <div style="position: absolute;width: 50px;height: 50px;background-color: red;right: 0;top: 0"></div> <div style="position: absolute;width: 50px;height: 50px;background-color: darkgoldenrod;top: 0;bottom: 0"></div> <div class="box" style="position: absolute; top: 50%;left: 50%;margin-top: -50px;margin-left: -50px;"></div> </div></body></html>position
Css、javascript、dom
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
