目的:在900*1500的版心右边设置50*150固定不随页面滚动条移动的板块
方法:给板块添加固定定位后先用left:50%将其定位在网页中间,再添加版心一半宽的外边距,从版心的中间移动至版心的右侧
代码如下
HTML文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style1.css">
</head>
<body>
<div class="core"></div>
<div class="w"></div>
</body>
</html>
CSS文件
.core{
width: 900px;
height: 1500px;
background-color: skyblue;
margin:0 auto;
}
.fixed{
position: fixed;
left: 50%;
margin-left: 450px;
width: 50px;
height: 150px;
background-color: black;
}