css布局实现一个胡子邋遢的男人头像代码
代码语言:html
所属分类:布局界面
代码描述:css布局实现一个胡子邋遢的男人头像代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
article {
--skin: #f85;
--skin-dark: #e63;
--line: #831;
--hair: #420;
--shirt: #eed;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
height: 90vmin;
aspect-ratio: 1;
overflow: hidden;
-webkit-mask:
radial-gradient(farthest-side, #000 85%, #0000)
;
background:
/* hair */
radial-gradient(farthest-side at 40% 60%, var(--hair) 99.2%, #0000 99.9%) 58% 17% / 30% 10.5%,
radial-gradient(farthest-side, var(--hair) 99%, #0000 99.9%) 68% 32%/ 11.5% 25%,
conic-gradient(at 100% 0, #0000 200deg, var(--hair) 0 240deg, #0000 0) 40% 13% / 14% 7%,
radial-gradient(100% 75% at 110% 50%, #0000 74%, var(--hair) 75%) 44% 12%/ 5% 7.6%,
radial-gradient(farthest-side at 100% 50%, var(--hair) 99.25%, #0000 99.9%) 28% 13.07% /.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0