<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <title></title>

    <style type="text/css">

        #redOne {

            width: 0;

            height: 0;

            border-left: 10px solid transparent;

            border-right: 10px solid transparent;

            border-bottom: 20px solid red;

        }

        #greenOne {

            width: 0;

            height: 0;

            border-left: 10px solid transparent;

            border-right: 10px solid transparent;

            border-top: 20px solid green;

        }

    </style>

</head>

<body>

    <div id="redOne"></div>

    <div id="greenOne"></div>

</body>

</html>

　　https://segmentfault.com/a/1190000002454383

css正三角倒三角的更多相关文章

  1. For循环打印正三角,倒三角,菱形

    A:正三角形: 内循环的判断条件:y<=x for(int x=0; x<5; x++) { for(int y=0; y<=x; y++) { System.out.print(& ...

  2. 用css画一个倒三角

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. css倒三角的几种实现方式

    在网页中,你在很多地方都能看到倒三角,比如tooltips,下拉菜单等.大家有几种方式来实现呢? 1.BASE64编码 图片 假如你已经有了三角形的图片,并且减少HTTP请求,那么将这个图片转换成一个 ...

  4. java实现打印正三角，倒三角

    正三角代码: package BasicType; /** * 封装一个可以根据用户传入值来打印正三角的方法 * @author Administrator */ public class Enme ...

  5. css制作倒三角

    布局div,并命名为id="dropdown",在style使用border属性对div进行控制 #dropdown{ width:0px; height:0px; border- ...

  6. FineReport——JS二次开发（隐藏下拉框控件的倒三角）

    在对FR控件进行二次开发的过程中,需要自定义样式,比如下拉框控件带有自动检索的功能,但是又希望它的显示样式如同文本框一样,这时就需要隐藏多余的部分. 在对在线文档的查阅中可以发现很多选择器适用于多种控 ...

  7. CSS实现圆角，三角，五角星，五边形，爱心，12角星，8角星，圆，椭圆，圆圈，八卦

    转自:http://blog.csdn.net/chenhongwu666/article/details/38905803 CSS实现圆角,三角,五角星,五边形,爱心,12角星,8角星,圆,椭圆,圆 ...

  8. Html 中select标签的边框与右侧倒三角的去除

    首先是边框的去除:可以设置属性border:none;或border:0px; 不过这还是有一个bug,不同浏览器会在选中select标签时,加上一个边框: 之后是右侧倒三角的去除:设置属性 appe ...

  9. 利用overflow实现导航栏中常 出现的倒三角下拉小图标

    常用网页界面中,导航栏中的倒三角下拉小图标实现,可用overflow: 效果如右图: .Triangle{position:relative;width:280px;height:15px;} ;ov ...

随机推荐

  1. ogg的孩子-无损音频编解码flac

    flac是一款无损的音频压缩编码,它的特点是对音频文件进行无损压缩,目前是被很多软件及智能硬件产品所支持. 从技术上来讲,该编解码的优点还是十分明显的,无损压缩,策略灵活,解码快速,硬件支持等特点都是 ...

  2. python2与python3的区别 ，小数据池 bytes 类型

    一.python2和3的区别 在python3中 在python2中 print('ab')方式打印内容()括号是必须要有的.   print 'ab' 可以加可以不加. 只有range   有ran ...

  3. ACM_素数筛选

    /* *素数筛法,判断小于MAXN的数是不是素数. *notprime是一张表,为false表示是素数,true表示不是素数 */ const int MAXN = 1000010; bool not ...

  4. QT 操作 excel 教程

    前言:环境 win7 64位,QT4.8.5,QT Creator 在 .pro 文件中加入语句"CONFIG+=qaxcontainer"; 源码如下: //main.cpp # ...

  5. 图解vue生命周期

    学习vue时搞清楚生命周期可以帮助你知道什么时候在什么地方执行该执行的方法,话不多说上图: 复制下面代码可以在控制台更详细展示各个钩子的状态 <!DOCTYPE html> <htm ...

  6. Java高并发秒杀系统API之SSM框架集成swagger与AdminLTE

    初衷与整理描述 Java高并发秒杀系统API是来源于网上教程的一个Java项目,也是我接触Java的第一个项目.本来是一枚c#码农,公司计划部分业务转java,于是我利用业务时间自学Java才有了本文 ...

  7. Apache、IIS、Nginx等绝大多数web服务器，都不允许静态文件响应POST请求，否则会返回“HTTP/1.1 405 Method not allowed”错误。

    例1:用Linux下的curl命令发送POST请求给Apache服务器上的HTML静态页 [root@new-host ~]# curl -d 1=1 http://www.sohu.com/inde ...

  8. HTML5 Audio/Video 标签,属性,方法,事件汇总 （转）

    标签属性:src:音乐的URLpreload:预加载autoplay:自动播放loop:循环播放controls:浏览器自带的控制条 1 http://www.abc.com/test.mp3&quo ...

  9. 前端自动化构建工具Gulp简单入门

    昨天听同事分享了Gulp的一些简单使用,决定自己也试一试. 一.安装 gulp是基于nodejs的,所以要先下载安装node(直接搜node,在官网下载就好了) 1.全局安装gulp npm inst ...

  10. android 基础04-BroadCastReceiver

    Android 系统中的广播(BroadCast) 是组件与组件进行的一种可跨线程的通信方式.类似于 广播者-订阅者(publish-subscribe) 的实现,当系统或者某个应用的状态发生改变时, ...