css设定圆形头像

编程知识更新时间:2023-04-06 07:56:37

CSS圆形头像

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob)</title>
</head>
	
	<style>
		.aa{
			width:100px;
			height:100px;
			border-radius:50%;
			overflow:hidden;
		}
		.aa img{
		position: relative ;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
			margin:0 auto;
			  height:100%;
		}
	</style>
<body>

	<div class="aa">
		<img src="https://img2.baidu/it/u=2795724226,3705372660&fm=26&fmt=auto"/>
	</div>
</body>
</html>