单个div+css实现卡通络腮胡男人人物头像效果代码
代码语言:html
所属分类:布局界面
代码描述:单个div+css实现卡通络腮胡男人人物头像效果代码
代码标签: 单个 div css 卡通 络腮胡 男人 人物 头像
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> body { min-height: 400px; height: 100vh; position: relative; background-color: #ddd; text-align: center; } div { position: absolute; left: 50%; top: 50%; } div::before, div::after { display: block; content: ''; position: absolute; } @media (max-width: 400px) { div:not(.no-scale) { transform: scale(0.8); } } #quiet { width: 250px; height: 250px; margin-left: -125px; margin-top: -125px; background: radial-gradient(circle, rgba(0,0,0,0.15) 50%, rgba(0,0,0,0) 50.8%) 14% 30%/11% 11%, radial-gradient(circle, #ffdab9 50%, rgba(255,218,185,0) 50.8%) 10% 30%/16% 16%, radial-gradient(circle, #8b4513 50%, rgba(139,69,19,0) 50.8%) 7.5% 29%/20% 20%, radial-gradient(circle, rgba(0,0,0,0.15) 50%, rgba(0,0,0,0) 50.8%) 86% 30%/11% 11%, radial-gradient(circle, #ffdab9 50%, rgba(255,218,185,0) 50.8%) 90% 30%/16% 16%, radial-gradient(circle, #8b4513 50%, rgba(139,69,19,0) 50.8%) 92.5% 29%/20% 20%, radial-gradient(circle at 50% 0, #ffdab9 29.5%, #8b4513 30%, #8b4513 35%, rgba(139,69,19,0) 35.5%) 50% 95%/40% 20%, radial-gradient(ellipse at 50% 100%, rgba(139,69,19,0) 49%, #8b4513 49.5%, #8b4513 52%, rgba(139,69,19,0) 52.5%) 50% 110%/120% 40%, radial-gradient(circle at 50% 0, rgba(255,255,255,0) 35%, white 35%, white 45%, rgba(255,255,255,0) 45.5%) 50% 89%/40% 13%, linear-gradient(#8b4513, #8b4513) 37% 100%/0.25em 22%, linear-gradient(#8b4513, #8b4513) 63% 100%/0.25em 22%, linear-gradient(80deg, rgba(0,0,0,0) 50%, #333 50.5%) 24% 100%/1em 18%, linear-gradient(-80deg, rgba(0,0,0,0) 50%, #333 50.5%) 76% 100%/1em 18%, linear-gradient(162deg, rgba(0,0,0,0) 10%, #333 10%) 30% 100%/1.5em 21%, linear-gradient(-162deg, rgba(0,0,0,0) 10%, #333 10%) 70% 100%/1.5em 21%, radial-gradient(ellipse at 100% 100%, #556b2f 50%, rgba(85,107,47,0) 50.5%) 0 100%/37% 29%, radial-gradient(ellipse at 0 100%, #556b2f 50%, rgba(85,107,47,0) 50.5%) 100% 100%/37% 29%, radial-gradient(ellipse at 50% 100%, #222 51%, rgba(0,0,0,0) 51.5%) 50% 110%/120% 40%, radial-gradient(circle at 50% 0, rgba(0,0,0,0.15) 40%, rgba(0,0,0,0) 40.5%) 50% 82%/20% 20%, linear-gradient(to right, #8b4513 4px, rgba(139,69,19,0) 4px) 50% 80%/20% 20%, linear-gradient(to left, #8b4513 4px, rgba(139,69,19,0) 4px) 50% 80%/20% 20%, linear-gradient(#ffdab9, #ffdab9) 50% 80%/20% 20%, linear-gradient(#4.........完整代码请登录后点击上方下载按钮下载查看
网友评论0