加入收藏 | 设为首页 | 会员中心 | 我要投稿 晋中站长网 (https://www.0354zz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 服务器 > 系统 > 正文

CSS画出一个可爱神奇的多啦A梦

发布时间:2020-03-17 08:29:33 所属栏目:系统 来源:站长网
导读:副标题#e# 小叮当简单颜色单一,操作起来也很容易上手。接下来的一个实例就是用css画出一个多啦A梦,首先将其分为头部,和身体。然后,再根据身体各部分细节进行进一步的具体刻画。 由于最近一直在学习JavaWeb方面的东西,所以,我的这个小叮当就是用jsp页

    background:-webkit-gradient(linear,right top,left bottom,from(#fff),color-stop(0.5,#fff),color-stop(0.7,#eee),color-stop(0.8,#ddd),to(#999));   

    background:-moz-linear-gradient(right top,#fff,#fff 50%,#eee 70%,#ddd 80%,#999);   

    position:absolute;   

    height:60px;width:60px;   

    border: 2px solid #000;   

    border-radius:30px;   

}   

  

.doraemon .hand_right .circle{   

    left:40px;   

    top:32px;   

}   

.doraemon .hand_left .circle{   

    left:-20px;   

    top:32px;   

}   

.doraemon .arm_rewrite{   

    background:#07beea;   

    position:relative;   

    height:45px;width:5px;   

}   

.doraemon .hand_right .arm_rewrite{   

    left:20px;   

    top:-45px;   

}       

.doraemon .hand_left .arm_rewrite{   

    left:60px;   

    top:-45px;   

    background:#0096be;   

}       

.doraemon .foot{   

    height:40px;   

    left:20px;   

    position:relative;   

    top:-141px;   

    width:280px;       

}       

.doraemon .foot .left{   

    background:#fff;   

    background:-webkit-gradient(linear,right top,left bottom,from(#fff),color-stop(0.75,#fff),color-stop(0.85,#eee),to(#999));   

    background:-moz-linear-gradient(right top,#fff,#fff 75%,#eee 85%,#999);   

    background:-ms-linear-gradient(right top,#fff,#fff 75%,#eee 85%,#999);   

    border: 2px solid #333;   

    border-radius:80px 60px 60px 40px;   

    box-shadow:-6px 0 10px rgba(0,0,0,0.35);   

    height:30px;   

    left:14px;   

    position:relative;   

    top:69px;   

    width:125px;   

}       

.doraemon .foot .right{   

    background:#fff;   

    background:-webkit-gradient(linear,right top,left bottom,from(#fff),color-stop(0.75,#fff),color-stop(0.85,#eee),to(#999));   

    background:-moz-linear-gradient(right top,#fff,#fff 75%,#eee 85%,#999);   

    background:-ms-linear-gradient(right top,#fff,#fff 75%,#eee 85%,#999);   

    border: 2px solid #333;   

    border-radius:80px 60px 60px 40px;   

    box-shadow:-6px 0 10px rgba(0,0,0,0.35);   

    height:30px;   

    left:141px;   

    position:relative;   

    top:39px;   

    width:125px;   

}   

.doraemon .foot .foot_rewrite{   

    position:relative;   

    top:0px;   

    left:132px;   

    _left:127px;   

    width:20px;   

    height:11px;   

    background:#fff;   

    background:-webkit-gradient(linear,right top,left bottom,from(#666),color-stop(0.83,#fff),to(#fff));   

    background:-moz-linear-gradient(right top,#666,#fff 83%,#fff);   

    background:-ms-linear-gradient(right top,#666,#fff 83%,#fff);   

    border-top:2px solid #000;   

    border-right:2px solid #000;   

    border-left:2px solid #000;   

    border-top-right-radius:40px;   

    border-top-left-radius:40px;   

}       

  

(编辑:晋中站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读