练习了不同的定位方式
The Position Test
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel = "stylesheet" href="CSS.css"> <title>The Position Test</title> </head> <body> <dir id="one">1</dir> <dir id="two">2</dir> <dir id="three">3</dir> <dir id="four">4</dir> </body> </html>
这是CSS.css文件
* { border: 2px solid #357; padding: 120px; 100px; height: 100px; } #one { background-color: blueviolet; position: relative; } #two { background-color: peru; position: absolute; } #three { background-color: lawngreen; position: relative; } #four { background-color: darkred; position: static; }