展开

关键词

一个CSS画的灰太狼,IE下属于重口味,慎看!

: 20; -webkit-border-top-left-radius: 600px 1200px; -webkit-border-top-right-radius: 400px 700px; -webkit-border-bottom-left-radius : 113px; width: 11px; height: 4px; border: 3px solid #181818; border-right: 0; border-top: 0; background 0; -webkit-border-top-left-radius: 400px 200px; -webkit-border-top-right-radius: 400px 200px; -moz-border-radius-topleft : 3px solid #181818; background: #FFF; z-index: 50; -webkit-border-top-left-radius: 700px 0; -webkit-border-top-right-radius : 3px solid #181818; border-top: 0; background: #666B6F; z-index: 0; -webkit-border-top-left-radius:

32660

【前端切图】用css画一个卡通形象-小猪佩奇

#ffb3da; transform: rotate(35deg); z-index: 102; box-sizing: border-box; border-top-color: #ffb3da;}. : border-box; border-top-color: #ffb3da; border-right-color: #ffb3da;}.pig_jaw_right { width: 13px; height : border-box; transform: rotate(19deg); border-top-color: #ffb3da;}.mouth_top { width: 135px; height: : #fff; z-index: 99; border: 8px solid #ffbadf; border-top-color: #fff;}.tail_blank { width: 36px; height { width: 7px; height: 11px; top: 450px; left: 336px; border: 8px solid #ffbadf; border-radius: 50% 50%

1.3K40
  • 广告
    关闭

    11.11智惠云集

    2核4G云服务器首年70元,还有多款热门云产品满足您的上云需求

  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    纯CSS3绘制的逼真,呆萌,超酷的CSS3动画纯CSS3人物行走动画 逼真炫酷CSS3动画纯CSS3绘制的小猫笑脸动画 超呆萌纯CSS3绘制可爱小男孩动画 超酷面部表情

    0 3px 0 0; z-index:-2; -webkit-border-top-right-radius:20px 120px; -moz-border-top-right-radius:20px 120px; -ms-border-top-right-radius:20px 120px; -o-border-top-right-radius:20px 120px; border-top-right-radius :40px 120px; -moz-border-top-right-radius:40px 120px; -ms-border-top-right-radius:40px 120px; -o-border-top-right-radius 0 0; -webkit-border-top-left-radius:40px 120px; -moz-border-top-left-radius:40px 120px; -ms-border-top-left-radius :40px 120px; -o-border-top-left-radius:40px 120px; border-top-left-radius:40px 120px; -webkit-border-bottom-left-radius

    84510

    CSS画各种图形(五角星、吃豆人、太极图等)

    ; }shape-triangle-top-left #triangle-topleft { width: 0; height: 0; border-top: 100px solid red; border-right : absolute; left: -50px; top: 50px; width: 0; height: 0; border: 50px solid transparent; border-top-color ; left: -50px; top: 70px; width: 0; height: 0; border: 50px solid transparent; border-top: 70px solid ; left: -50px; top: 20px; width: 0; height: 0; border: 50px solid transparent; border-top: 70px solid : 60px solid red; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-left-radius

    79120

    想修改CSS

    ;         BORDER-TOP: #E5E5E5 1PX SOLID;         BORDER-LEFT: #E5E5E5 1PX SOLID;        BORDER-BOTTOM .BGB{        BORDER-RIGHT: #E5E5E5 1PX SOLID;         BORDER-TOP: #E5E5E5 1PX SOLID;         BORDER-LEFT  1PX SOLID;        BORDER-TOP: #E5E5E5 1PX SOLID;          BORDER-LEFT: #E5E5E5 1PX SOLID;          } BORDER-LEFT: #E5E5E5 1PX SOLID;         BORDER-BOTTOM: #E5E5E5 1PX SOLID;        }.BOTB{        BORDER-TOP BORDER-TOP: #E5E5E5 1PX SOLID;        }.TB{        BORDER-TOP: #E5E5E5 1PX SOLID;         }.BB{

    312100

    45个值得收藏的 CSS 形状

    ; border-top: 100px solid red;}7.左三角? : 0 solid transparent; border-top: 3px solid red; border-radius: 20px 0 0 0; top: -12px; left: -9px; top: 20px; width: 0; height: 0; border: 50px solid transparent; border-top: 70px solid red;}25.钻戒? top: 70px; width: 0; height: 0; border: 50px solid transparent; border-top: 70px solid red;}26.钻石2? border-left: 60px solid red; border-bottom: 60px solid red; border-top-left-radius: 60px; border-top-right-radius

    33420

    45个值得收藏的 CSS 形状

    50px solid transparent; border-top: 100px solid red; position: absolute; content: ; top: 30px; left: ; top: 20px; width: 0; height: 0; border: 50px solid transparent; border-top: 70px solid red;} 25.钻石2 transparent; border-top: 70px solid red;} 27. ; border-top: 60px solid red; border-left: 60px solid red; border-bottom: 60px solid red; border-top-left-radius ; right: 100%; top: 26px; width: 0; height: 0; border-top: 13px solid transparent; border-right: 26px

    34440

    html前端之css绘制形状

    : 0 solid transparent; border-top: 3px solid red; border-radius: 20px 0 0 0; top: -12px; left: -9px; top: 20px; width: 0; height: 0; border: 50px solid transparent; border-top: 70px solid red;}Diamond Narrow top: 70px; width: 0; height: 0; border: 50px solid transparent; border-top: 70px solid red;}Cut Diamond border-left: 60px solid red; border-bottom: 60px solid red; border-top-left-radius: 60px; border-top-right-radius ; right: 100%; top: 26px; width: 0; height: 0; border-top: 13px solid transparent; border-right: 26px

    27811

    CSS实现图形效果

    transparent; border-bottom: 100px solid #4C98F7; } #corner-triangle{ width: 0; height: 0; border-top: : absolute; left: -100px; top: 100px; width: 0; height: 0; border: 100px solid transparent; border-top-color 0; border-top: 13px solid transparent; border-right: 26px solid #4C98F7; border-bottom: 13px solid transparent : 60px solid transparent; border-top: 60px solid #4C98F7; position: absolute; content: ; top: 20px; left : 0; border-top: 13px solid transparent; border-right: 26px solid #4C98F7; border-bottom: 13px solid

    18060

    CSS好看的按钮

    好看的按钮 .btn { BORDER-RIGHT: #7b9ebd 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7b9ebd 1px solid; PADDING-LEFT btn1_mouseout { BORDER-RIGHT: #7EBF4F 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7EBF4F 1px solid; PADDING-LEFT btn1_mouseover { BORDER-RIGHT: #7EBF4F 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7EBF4F 1px solid; { BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #2C59AA 1px solid; PADDING-LEFT: btn3_mouseover { BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #2C59AA 1px solid;

    35870

    CSS画各种图形(五角星、吃豆人、太极图等)

    solid transparent; border-top: 100px solid red; border-radius: 50%;梯形? ; border-top: 25px solid red;}返回箭头? position: absolute; border: 0 solid transparent; border-top: 3px solid red; border-radius: 20px 0 0 0 : 60px solid red; border-left: 60px solid red; border-bottom: 60px solid red; border-top-left-radius: 50%; margin-left: -3em; top: -7em; border-top-left-radius: 3em; border-top-right-radius: 3em;}#lock:

    79810

    转一个css3绘制的iPhone6

    : 372px; border-radius: 50px; position: absolute; background: none; box-shadow: none; left: 206px; top : 77px; border-bottom-left-radius: 49px; border-bottom-right-radius: 86px; border-top-right-radius: 70px : 76px; border-top-right-radius: 200px; border-bottom-left-radius: 40px; border-bottom-right-radius: border-radius: 0 1px 1px 0;}#fabrizio { border-top: 100px solid black; border-right: 63px solid transparent : 230px;left: 40px;width: 296px;height: 50px;border-top: 1px solid #86E2F0;border-bottom: 1px solid #86E2F0

    27780

    css笔记 - 张鑫旭css课程笔记之 border

    : 50%; } .add::before{ margin-top: -5px; margin-left: -30px; border-top: 10px solid; } .add::after{ margin-top : 50%; } .add::before{ margin-top: -5px; margin-left: -30px; border-top: 10px solid; } .add::after{ margin-top : 200px; border: 60px solid; border-top-color: #fff6b9; border-right-color: #aaffb4; border-bottom-color 模拟圆角效果利用border-topborder-bottom的两端斜边效果 ? } .bottom1{ border-width: 30px; border-top-color: rgb(83, 0, 0); }5.

    27220

    CSS卡通小汽车

    : 37%; width: 77%; height: 23%; border-top: calc(1 * var(--unit)) solid #1c2a37; border-radius: 0% 49% : absolute; left: 23%; top: 82%; width: 47%; height: 4%; background: #121212; border-radius: 0 0 10px : 0%; width: 80%; height: 100%; border-right: 1px solid #1c2a37; border-top: 1px solid #1c2a37; border-radius : 40%; border-top: calc(1 * var(--unit)) #b6d4de solid; border-radius: 100% 75% 75% 100% 100% 75% 75% : 7%; width: 50%; height: 65%; border-top: calc(1 * var(--unit)) #1c2a37 solid; border-radius: 0% 72%

    21220

    移动端解决一像素边框问题。拿走不谢,border.css

    @charset utf-8;.border,.border-top,.border-right,.border-bottom,.border-left,.border-topbottom,.border-rightleft ::before,.border-top::before,.border-right::before,.border-bottom::before,.border-left::before,.border-topbottom ; transform-origin: 0 0;}.border-top::before,.border-bottom::before,.border-topbottom::before,.border-topbottom ::after,.border-bottomleft::after { top: 0; width: 1px; height: 100%;}.border-top::before,.border-topbottom ,.border-topleft::before,.border-topright::before { top: 0;}.border-right::before,.border-rightleft::

    32510

    在retina屏中实现1px border效果

    : url($onepxImgDirname) 0 0 2 0 stretch; } @else if $position == top { border-width: 1px 0 0 0; -webkit-border-image , .imglinenew.png);} (userinclude) onepx(.border-top, top);(userinclude) onepx(.border-bottom);执行bat文件 : sass --scss --style expanded test.scss test.css 生成css代码:.container .myonepx { border-top: 1px solid : url(.imglinenew.png) 2 0 0 0 stretch; }} .border-top { border-top: 1px solid #666666;} @media only screen and (-webkit-min-device-pixel-ratio: 2) { .border-top { border-top: none; border-width: 1px 0

    53370

    在 retina 屏中实现1 px border 效果

    : url($onepxImgDirname) 0 0 2 0 stretch; } @else if $position == top { border-width: 1px 0 0 0; -webkit-border-image );} @include onepx(.border-top, top);@include onepx(.border-bottom);执行bat文件:sass --scss --style expanded -webkit-min-device-pixel-ratio: 2) { .container .myonepx { border-top: none; border-width: 1px 0 0 0; 0 stretch; }} .border-top { border-top: 1px solid #666666;} @media only screen and (-webkit-min-device-pixel-ratio : 2) { .border-top { border-top: none; border-width: 1px 0 0 0; -webkit-border-image: url(.imglinenew.png

    57600

    在retina屏中实现1px border效果

    : url($onepxImgDirname) 0 0 2 0 stretch; } @else if $position == top { border-width: 1px 0 0 0; -webkit-border-image , .imglinenew.png);} (userinclude) onepx(.border-top, top);(userinclude) onepx(.border-bottom);执行bat文件 : sass --scss --style expanded test.scss test.css 生成css代码:.container .myonepx { border-top: 1px solid : url(.imglinenew.png) 2 0 0 0 stretch; }} .border-top { border-top: 1px solid #666666;} @media only screen and (-webkit-min-device-pixel-ratio: 2) { .border-top { border-top: none; border-width: 1px 0

    18020

    纯CSS实现小三角提示信息

    :0; height:0; border-top:15px solid transparent; border-bottom:15px solid transparent; border-right:15px 0; border-top:15px solid transparent; border-bottom:15px solid transparent; border-left:15px solid #fff ; } *上三角* .entry-trangle-top{ position:absolute; top:-10px; left:20px; width:0; height:0; border-left solid transparent; border-right:15px solid transparent; border-top:15px solid #fff; } html: hello,我出生了 15px; position:absolute; right:-30px; top:20px; border-style:dashed solid solid dashed; border-color:

    84730

    DevOps工具介绍连载(4)——SALTSTACK

    important;border-width: initial !important;border-style: none !important;border-color: initial ! important;border-width: initial !important;border-style: none !important;border-color: initial ! important;border-width: initial !important;border-style: none !important;border-color: initial ! important;border-width: initial !important;border-style: none !important;border-color: initial ! important;border-width: initial !important;border-style: none !important;border-color: initial !

    22100

    相关产品

    • 云服务器

      云服务器

      腾讯云服务器(CVM)为您提供安全可靠的弹性云计算服务。只需几分钟,您就可以在云端获取和启用云服务器,并实时扩展或缩减云计算资源。云服务器 支持按实际使用的资源计费,可以为您节约计算成本。

    相关资讯

    热门标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      扫码关注云+社区

      领取腾讯云代金券