We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Learn more about funding links in repositories.
Report abuse
There was an error while loading. Please reload this page.
第729天 使用css实现圆形的头像的效果（注：要考虑正方形、长方形情况）
3+1官网
我也要出题
CSS， 命名一个App.css: `.circle{ position: relative; border:2px solid black; width:100px; height:100px; border-radius: 50%; overflow: hidden; } .circle img{ position: relative; height:auto; max-width: 100%; object-fit: cover; top:50%; transform: translate(0%,-50%); border-radius: 50%;
} ` HTML部分,我使用的是React： 随便用Img元素，引入任意一个图片，把img元素包裹在一个div里，div类名是circle
` import './App.css' export function App(){ return (
`
Activity
Eacolt commentedon Apr 14, 2021
CSS， 命名一个App.css:
`.circle{
position: relative;
border:2px solid black;
width:100px;
height:100px;
border-radius: 50%;
overflow: hidden;
}
.circle img{
position: relative;
height:auto;
max-width: 100%;
object-fit: cover;
top:50%;
transform: translate(0%,-50%);
border-radius: 50%;
}
`
HTML部分,我使用的是React：
随便用Img元素，引入任意一个图片，把img元素包裹在一个div里，div类名是circle
`
import './App.css'
export function App(){
return (
<div className={"circle"}><img src={'./img/158.png'}/>
);
}
`