div+css布局实现一个卡通女孩在电脑前工作代码
代码语言:html
所属分类:布局界面
代码描述:div+css布局实现一个卡通女孩在电脑前工作代码
代码标签: div css 布局 卡通 女孩 电脑 工作 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html lang="en"> <head> <style> .cartoon { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) } .cartoon div { position:absolute; box-sizing:border-box } .b { border:.75vmin solid black } .r { border-radius:100% } .hb::before,.ha::after { content:""; display:block; position:absolute } html,body { overflow:hidden } .shadow { width:150%; height:106%; background:#ffc; left:50%; top:50%; transform:translate(-50%,-50%) rotate(-15deg); overflow:hidden } .shadow::after { content:'<div class="cartoon"><div class="shadow ha r"></div> <div class="hair-back ha hb"></div><div class="neck"></div><div class="ear ha r"></div><div class="ear ha r"></div><div class="face"><div class="cheek r"></div><div class="cheek r"></div><div class="eye"><div class="pupil hb r"></div></div><div class="eye"><div class="pupil hb r"></div></div><div class="eyebrow r"></div><div class="nose r b"></div><div class="mouth r b"></div></div><div class="bangs-1 ha"></div><div class="bangs-2"><.........完整代码请登录后点击上方下载按钮下载查看
网友评论0