设为首页 - 加入收藏 ASP站长网(Aspzz.Cn)- 科技、建站、经验、云计算、5G、大数据,站长网!
热搜: 创业者 手机 数据
当前位置: 首页 > 服务器 > 系统 > 正文

使用CSS3代码绘制可爱的Hello Kitty猫(3)

发布时间:2020-03-15 14:10 所属栏目:52 来源:站长网
导读:border-top-left-radius:138px100px; border-bottom-left-radius:334px310px; background-color:white; transform:rotate(23deg); z-index:99; } 让耳朵和脸蛋连为一体: CSS Code复制内容到剪贴板 .hello-kitty-di

    border-top-left-radius: 138px 100px;   

    border-bottom-left-radius: 334px 310px;   

    background-color: white;   

    transform: rotate(23deg);   

    z-index: 99;   

}   

让耳朵和脸蛋连为一体:

CSS Code复制内容到剪贴板

.hello-kitty-div .left-ear-clean {   

    left: 146px;   

    top: 96px;   

    width: 250px;   

    height: 250px;   

    border-top-left-radius: 138px 100px;   

    border-bottom-left-radius: 360px 310px;   

    background-color: white;   

    transform: rotate(23deg);   

    z-index: 101;   

}  

再稍加点缀,美化一下:

CSS Code复制内容到剪贴板

.hello-kitty-div .left-ear-beautify {   

    left: 149px;   

    top: 221px;   

    width: 60px;   

    height: 30px;   

    border-top-left-radius: 20px 15px;   

    border-top-rightright-radius: 25px 15px;   

    border-bottom-left-radius: 20px 15px;   

    border-bottom-rightright-radius: 25px 15px;   

    background-color: black;   

    transform: rotate(-52deg);   

    z-index: 102;   

}   

右耳

CSS Code复制内容到剪贴板

.hello-kitty-div .rightright-ear {   

    left: 600px;   

    top: 50px;   

    width: 250px;   

    height: 250px;   

(编辑:ASP站长网)

网友评论
推荐文章
    热点阅读