<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>太极图</title><style type="text/css" media="screen">#a{width: 300px;height: 600px;border: 1px solid black;background: white;border-right: 300px solid black;border-radius: 50%;}#a::before{content: '';display: block;/* 300/3 */width: 100px;height: 100px;background: white;border: 100px solid black;border-radius: 50%;margin-left: 150px;}#a::after{content: '';display: block;width: 100px;height: 100px;background: black;border: 100px solid white;border-radius: 50%;margin-left: 150px;}</style>
</head>
<body><div id='a'></div>
</body>
</html>