<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
#c1{
width: 500px;
height: 500px;
background-color: #FF6500;
border-radius: 500px;
overflow: hidden;
}
#c2{
width: 200px;
height: 200px;
background-color: aqua;
border-radius: 100px;
margin: auto;
margin-top: 150px;
（margin-top: 150px;中的150px的来源 500/2-200/2=150）
}
<!-- overflow: hidden配合margin使用使圆居于正中间 -->
</style>
<title></title>
</head>
<body>
<div id="c1">
<div id="c2">
</div>
</div>
</body>
</html>
若#c1中没有overflow: hidden;
#c2中没有margin: auto;margin-top: 150px;
则
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
