css布局实现一个无敌浩克卡通效果代码
代码语言:html
所属分类:布局界面
代码描述:css布局实现一个无敌浩克卡通效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> :root { --green: #81ff00; --purple: #7e00ff; --gray: #333; --angle: 0deg; } * { box-sizing: border-box; } html { background: #111; display: grid; place-items: center; min-height: 100vh; font-family: "Chelsea Market", sans-serif; } /* html:after { content: "HULK"; position: absolute; left: 50%; top: 0%; transform: translate(-50%, 0%); font-size: 25vw; z-index: -1; opacity:.13; } */ #hulk_box { filter: drop-shadow(0 0 200px var(--purple)); perspective: 300px; } #hulk_box:before { content: ""; width: 300px; height: 100px; background: #788; position: absolute; top: 75%; transform: translateX(-25%) rotateX(45deg); } #hulk_body { width: 150px; height: 225px; background: var(--green.........完整代码请登录后点击上方下载按钮下载查看
网友评论0