position: fixed;
left: 50%;
margin-left: -150px;
综合案例(淘宝焦点图的做法)
-
效果图
-
代码
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>淘宝焦点图定位</title>
<style>
* {
margin: 0;
padding: 0;
}
li {
list-style: none;
}
a {
text-decoration: none;
}
.tb-promo {
position: relative;
/* 子绝父相 */
margin: 200px auto