爬虫中css定位时怎么用for循环定位
发布网友
发布时间：2023-09-26 20:46
共1个回答
热心网友
时间：2023-09-26 23:16
<HTML>
<head>
<style>
.red{border:2px solid red;}
</style>
</head>
<body>
<div style="padding:10px;width:100px;" class="red">
<div id="a" class="red">AAAA</div>
<div id="b" class="red">BBBB</div>
</div>
</body>
</html>
以上代码在浏览器中的显示效果如下：
AAAA
BBBB
下面通过position属性来把AAAA往上移动8px，在head的style里面加入#a{position:relative;top:-8px;}即：
<HTML>
<head>
<style>
.red{border:2px solid red;}
#a{position:relative;top:-8px;}
</style>
</head>
<body>
<div style="padding:10px;width:100px;" class="red">
<div id="a" class="red">AAAA</div>
<div id="b" class="red">BBBB</div>
</div>
</body>
</html>
效果如下：
AAAA
BBBB
而如果通过margin-top:-8px来调整的话，即：
<HTML>
<head>
<style>
.red{border:2px solid red;}
#a{margin-top:-8px;}
</style>
</head>
<body>
<div style="padding:10px;width:100px;" class="red">
<div id="a" class="red">AAAA</div>
<div id="b" class="red">BBBB</div>
</div>
</body>
</html>
效果如下：
AAAA
BBBB
看到不同了吧，用position属性来调整的时候，只是被调整的div移动了，而下面的div不会动；用margin属性调整就不同了，下面的div也会相应的向上移动8px，但是并不影响下面的padding值。
