關於position:absolute的小用處
阿新 • • 發佈：2018-11-06
上圖插入了一個小商標，這個正是用position:absolute來寫的，極大的方便了商標的插入
下面就來介紹一下這個position:absolute書寫這個的過程
在html中用span行級標籤去框這個小圖示，而不能用塊級標籤
<!DOCTYPE html> <html lang="en"> <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"> <title>postion定位的作用</title> </head> <body> <span> 我是圖示 </span> <img src="images/1.jpg" alt=""> </body>
在css中，需要把position:abselute加入這個span標籤中，讓span標籤脫離當前的頁面
*{
margin: 0px;
padding: 0px;
}
span{
position: absolute;
left:20px;
top: 20px;
height: 50px;
width: 100px;
}只需要一個簡單的position:abselute標籤就可以簡單的實現給圖片加商標的可能