用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. NET Core 使用EF Core的Code First迁移和DBFirst

    DBFirst (1)Microsoft.EntityFrameworkCore (2)Microsoft.EntityFrameworkCore.Design (3)Microsoft.Entity ...

  2. git文件锁定不更新和忽略

    git文件的忽略 新建未提交的文件直接添加.gitignore 提交之后的文件已被git追踪 这时需要清除git缓存 忽略文件 git rm --cached ./src/main/resources ...

  3. GitLab CI构建SpringBoot-2.3应用

    欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...

  4. 手摸手带你用Hexo撸博客(二)之配置主题

    在上一篇博客手摸手带你用Hexo撸博客(一)中主要介绍了博客的初步搭建 今天我们继续讲如何在Hexo搭建的博客中应用主题 官网选择自己喜欢的主题 点击这里Hexo主题进入官网主题页面 然后选择自己喜欢 ...

  5. Java 从匿名内部类到Lambda表达式

    匿名内部类和Lambda表达式有很多类似之处,首先都是在使用的时候才对接口进行实现,只是Lambda接口中只能由一个需要被实现的方法. 所有的Lambda表达式都可以 由匿名内部类改写: interf ...

  6. Service Mesh——微服务中的流量管理中间件

    Service Mesh--微服务中的流量管理中间件 摘自-https://zhuanlan.zhihu.com/p/28794062 Service mesh 与 Cloud Native Kube ...

  7. git fork , git pull request那回事

    git fork 原理 相当于你在原项目的主分支上又建立了一个分支,你可以在该分支上任意修改,如果想将你的修改合并到原项目中时,可以pull request,这样原项目的作者就可以将你修改的东西合并到 ...

  8. webservcie学习之webservice平台技术与开发

    webservice平台技术有哪些 XML+XSD,SOAP和WSDL就是构成WebService平台的三大技术. 1.XML+XSD WebService采用HTTP协议传输数据,采用XML格式封装 ...

  9. C语言几种排序算法

    (1)选择排序算法:选择排序算法是,将第一个数和其它的数比较,将较小的数(从小到大的排列)和第一个数换位,以此类推 #include<stdio.h> int main() { int i ...

  10. 风炫安全WEB安全学习第十七节课 使用Sqlmap自动化注入(一)

    风炫安全WEB安全学习第十七节课 使用Sqlmap自动化注入(一) sqlmap的使用 sqlmap 是一个开源渗透测试工具,它可以自动检测和利用 SQL 注入漏洞并接管数据库服务器.它具有强大的检测 ...