首页 > Web开发 > 详细

CSS画图

时间:2020-07-21 21:41:27      阅读:73      评论:0      收藏:0      [点我收藏+]

一、画三角形

参考资料:https://www.cnblogs.com/wangjiachen666/p/9462837.html

思路:div的宽高设为0,线宽设为一个较大的数,边框颜色分开设置,把不需要的块背景色设为透明,就可以了。

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>三角型</title>
    <style type="text/css">
    div {
        width: 0px;
        height: 0px;
        border:150px solid #000;
        border-top-color:red;
        border-bottom-color:transparent;
        border-left-color:blue;
        border-right-color:transparent;       
    }
    </style>
</head>

<body>
    <div></div>
</body>

</html>

 结果:

技术分享图片

 

 图1.1 三角形

 

CSS画图

原文:https://www.cnblogs.com/CherishTheYouth/p/CherishTheYouth_20200721.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!