用CSS制做一个三角形！

    <style>

        .outer {

            width: 0;

            height: 0;

         border-left: 10px solid transparent;

         border-right: 10px solid #ccc;

         border-top: 10px solid transparent;

         border-bottom: 10px solid #ccc;

        }

    </style>

</head>

<body>

    <div class="outer"></div>

</body>

简单写法

    <style>

        .outer {

            width: 0;

            height: 0;

            border: 50px solid transparent;

            border-top-color: pink;

        }

    </style>

</head>

<body>

    <div class="outer"></div>

</body>

用CSS制做一个三角形！的更多相关文章

  1. 纯 CSS 创建一个三角形

    [要求]:用纯CSS创建一个三角形的原理是什么? ♪ 答: 把上.左.右三条边隐藏掉(颜色设为 transparent) [实现]: #demo { width: 0; height: 0; bord ...

  2. 用css制作一个三角形箭头

    剑走偏锋——用css制作一个三角形箭头   通常,我们做上图那个三角形,一般都是做张图,而且需要两张,因为一般都是下拉菜单的效果,需要有个hover的样式,箭头是反的.那是不是有更好的办法呢,毕竟要用 ...

  3. 如何用css实现一个三角形？

    昨天被人问到说如何用css实现一个三角形?em....  当时被问到了,汗颜,今天找了一些帖子看了一下,也算是记录一下吧 代码如下: 实现效果:

  4. CSS画一个三角形，CSS绘制空心三角形，CSS实现箭头

     壹 ❀ 引 这两天因为项目工作较少,闲下来去看了GitHub上关于面试题日更收录的文章,毕竟明年有新的打算.在CSS收录中有一题是 用css创建一个三角形,并简述原理 .当然对于我来说画一个三角形是 ...

  5. Effective前端3：用CSS画一个三角形

    p { text-indent: 2em } .triangle-container p { text-indent: 0 } img { margin: 15px 0 } 三角形的场景很常见,打开一 ...

  6. Effective前端(3)用CSS画一个三角形

    来源:https://zhuanlan.zhihu.com/p/26160325 三角形的场景很常见,打开一个页面可以看到各种各样的三角形: 由于div一般是四边形,要画个三角形并不是那么直观.你可以 ...

  7. Effective前端1---chapter 2 用CSS画一个三角形

    1.CSS画三角形的画法 第一步:三角形可以用border画出来,首先一个有四个border的div长这样: <div class="triangle"></di ...

  8. Web前端面试指导(十八)：用纯CSS创建一个三角形的原理是什么？

    题目点评 三角形的图标在网页设计是很常见的,属于基本常识题,只要在练习做到过这个功能都能回答出来,可以把你做过的思路描述出来就可以了,本题的难易程度为简单 答题要点 1.采用的是均分原理 盒子都是一个 ...

  9. 用纯CSS创建一个三角形

    原理:把上.左.右三条边隐藏掉(颜色设为 transparent) #demo { width:; height:; border-width: 20px; border-style: solid; ...

随机推荐

  1. Azure Service Bus（二）在NET Core 控制台中如何操作 Service Bus Queue

    一,引言 上一篇讲到关于 Azure ServiceBus 的一些概念,讲到 Azure Service Bus(服务总线),其实也叫 "云消息服务",是微软在Azure 上提供的 ...

  2. Docker Container 就是一个进程，多新鲜啊？

    大家对 Docker 都应该有了或多或少的认识了,相信大家都是从这两张图来粗旷的理解 Docker 及容器概念的 那我们如何更轻松的理解容器 Container 呢?说白了 Container 就是一 ...

  3. 无法启动IIS Express Web服务器

    解决 打开项目文文件夹以.csproj结尾的文件),找到WebProjectProperties节点然后,将图中框选的三项节点内容全部清空 删除.vs 重新启动即可

  4. Core3.0发布到IIS的流程

    前言 参考链接 https://www.cnblogs.com/wutongjun/p/11981798.html 在IIS上部署 .Net Core 3.0 项目的主要流程有: 安装并启用IIS 安 ...

  5. AspectJ之@DeclareParents注解为对象添加新方法

    众所周知,AspectJ可以通过@Before,@After,@Around等注解对连接点进行增强,今天我们来玩一个新注解@DeclareParents.对目标对象增强一个新方法. 场景引入: 现在我 ...

  6. CentOS Linux SVN服务器 配置用户目录访问 权限 Authorization failed

    SVN 修改 aurhz 文件设置用户目录访问权限格式: [/code] user=rw user 用户对code目录拥有读和写的权限. 但是访问 svn://192.168.1.59 的时候却提示A ...

  7. Redis集群搭建采坑总结

    背景 先澄清一下,整个过程问题都不是我解决的,我在里面就是起了个打酱油的角色.因为实际上我负责这个项目,整个过程也比较清楚.之前也跟具体负责的同事说过,等过段时间带他做做项目复盘.结果一直忙,之前做的 ...

  8. 这是一篇SQL注入文章

    目录 注入原理: 1.寻找注入点的方式或注入的地方可能包括. 2.注入点判断方法. 3.注入分类. 数字型: 字符型: 搜索型: XX型(也叫其他型): 4.注入提交方式. 5.注入攻击类型与方式. ...

  9. LVS之1---工作原理

    LVS之1---工作原理 LVS 介绍 LVS:Linux Virtual Server,Linux虚拟服务器,负载调度器,是一个由章文嵩(花名 正明)博士从1998年开始发起的自由软件项目. 软件作 ...

  10. ContactCollections Design Report

    通讯录的设计采用了分层+接口+面向对象+文件操作+方法实现 分三层实现,共使用了四个包,实现业务数据访问和界面的分离     contactaccess包实现对文件的访问         包括数据访问 ...