行內元素進行絕對定位后會變成塊級元素·
position:absolute;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
/* *{
padding: 0;
margin: 0;
} */
span{
position: absolute;
/* 一定要寫四個位置，否則無法居中顯示 */
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 400px;
height: 400px;
background: rgba(255, 0, 255, .6);
margin: auto;
}
</style>
</head>
<body>
<span>行內元素進行絕對定位后會變成塊級元素</span>
<a href="#">行內元素進行絕對定位后會變成塊級元素</a>
<a href="#">樣式，先寫width,height,position,top,right,bottom,left確定位置</a>
<a href="#">再寫不影響布局的color,background,font-size,font-family等等</a>
</body>
</html>
==============================================
行內元素進行固定定位后會變成塊級元素·
position:fixed;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
/* *{
padding: 0;
margin: 0;
} */
span{
position: fixed;
/* 一定要寫四個位置，否則無法居中顯示 */
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 400px;
height: 400px;
background: rgba(255, 0, 255, .6);
margin: auto;
}
</style>
</head>
<body>
<span>行內元素進行絕對定位后會變成塊級元素</span>
<a href="#">行內元素進行絕對定位后會變成塊級元素</a>
<a href="#">樣式，先寫width,height,position,top,right,bottom,left確定位置</a>
<a href="#">再寫不影響布局的color,background,font-size,font-family等等</a>
</body>
</html>