CSS 之定位(Positioning)
一、属性
属性 | 简介 |
---|---|
position | 检索对象的定位方式 |
z-index | 检索或设置对象的层叠顺序 |
top | 检索或设置对象与其最近一个定位的父对象顶部相关的位置 |
right | 检索或设置对象与其最近一个定位的父对象右边相关的位置 |
bottom | 检索或设置对象与其最近一个定位的父对象底边相关的位置 |
left | 检索或设置对象与其最近一个定位的父对象左边相关的位置 |
clip | 检索或设置对象的可视区域。区域外的部分是透明的 |
二、示例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>定位</title> <style> body{ position: relative; } div{ width: 200px; height: 200px; position: absolute; clip: rect(auto 100px 100px auto); background: red; color: #fff; } </style> </head> <body> <div>看看被剪切后的效果</div> </body> </html>