<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>

    <title>无标题文档</title>

    <link rel="shortcut icon" href="img/icoTest.ico">

</head>

<style type="text/css">

    /*三角形*/

    .triangle{

        width: 0;

        height: 0;

        border-width: 0 30px 30px;

        border-style: solid;

        border-color: transparent transparent #ccc;

        margin: auto;

    }

</style>

<body>

    <div class="triangle"></div>

</body>

<html>

css绘制图标的更多相关文章

  1. 摘记 史上最强大的40多个纯CSS绘制的图形（一）

    今天在国外的网站上看到了很多看似简单却又非常强大的纯CSS绘制的图形,里面有最简单的矩形.圆形和三角形,也有各种常见的多边形,甚至是阴阳太极和网站小图标,真的非常强大,分享给大家. Square(正方 ...

  2. 史上最强大的40多个纯CSS绘制的图形

    Square(正方形) #square { width: 100px; height: 100px; background: red; } Rectangle(矩形) #rectangle { wid ...

  3. 40多个纯CSS绘制的图形

    本文由码农网 – 陈少华原创,转载请看清文末的转载要求. 今天在国外的网站上看到了很多看似简单却又非常强大的纯CSS绘制的图形,里面有最简单的矩形.圆形和三角形,也有各种常见的多边形,甚至是阴阳太极和 ...

  4. CSS绘制简单图形

    究竟该用字体图标.图片图标.还是CSS画一个图标?我也不知道.各有千秋吧.本文将介绍如何用css绘制简单的图形,所有测试在chrome58.0完成,如果你不能得到正确结果请到caniuse查一查看看是 ...

  5. 史上最强大的40多个纯CSS绘制的图形[转]

    今天在国外的网站上看到了很多看似简单却又非常强大的纯CSS绘制的图形,里面有最简单的矩形.圆形和三角形,也有各种常见的多边形,甚至是阴阳太极和网站小图标,真的非常强大,分享给大家. Square(正方 ...

  6. 用CSS绘制最常见的40种形状和图形

    今天在国外的网站上看到了很多看似简单却又非常强大的纯CSS绘制的图形,里面有最简单的矩形.圆形和三角形,也有各种常见的多边形,甚至是阴阳太极和网站小图标,真的非常强大,分享给大家. Square(正方 ...

  7. 纯CSS绘制的图形一览

    整理网上一些使用纯CSS绘制的图形示例~~纯属抄袭,哈哈...仅仅是为了自己以后查看! Square(正方形) #square { width: 100px; height: 100px; backg ...

  8. CSS 魔法系列：纯 CSS 绘制三角形（各种角度）

    我们的网页因为 CSS 而呈现千变万化的风格.这一看似简单的样式语言在使用中非常灵活,只要你发挥创意就能实现很多比人想象不到的效果.特别是随着 CSS3 的广泛使用,更多新奇的 CSS 作品涌现出来. ...

  9. css绘制三角形原理

    1.新建一个元素,将它的宽高都设置为0:然后通过设置border属性来实现三角形效果,下面是css绘制三角形的原理: <!DOCTYPE html> <html> <he ...

随机推荐

  1. 从块级元素和行内元素的分析到bfc的布局理解

    接口和属性介绍 播放器提供了progressMakers属性,是一个数组类型,每一条记录包含offset时间和text打点的内容,还可以包含其他属性,此属性用于告诉播放器进度条打点记录,记录内容属性说 ...

  2. python打造12306余票实时监控

    # encoding=utf-8from Tkinter import *from ScrolledText import ScrolledTextimport urllib2import jsoni ...

  3. 洛谷 P3398 仓鼠找sugar 解题报告

    P3398 仓鼠找sugar 题目描述 小仓鼠的和他的基(mei)友(zi)sugar住在地下洞穴中,每个节点的编号为1~n.地下洞穴是一个树形结构.这一天小仓鼠打算从从他的卧室(a)到餐厅(b),而 ...

  4. python基础----继承与派生、组合、接口与归一化设计、抽象类、子类中调用父类方法

    一.什么是继承                                                                          继承是一种创建新的类的方式,在pyth ...

  5. android adb devices 后出现offline问题的解决

    Android在使用adb 命令时有时会发现设备的状态是offline,我的神呀,这怎么让我们调试呢.必须解决这个问题. 解决方式如下: 以下方法请确保你的设备处于调试模式下. 方法一:执行 #adb ...

  6. Qt ------ 主事件循环与 QEventLoop

    1.事件循环一般用exec()函数开启.QApplicaion::exec().QMessageBox::exec()都是事件循环.其中前者又被称为主事件循环. 事件循环首先是一个无限“循环”,程序在 ...

  7. 全表 or 索引

    这一篇文章证实了以前对MySQL优化程序的工作原理. MySQL就像一个人一样,总是聪明的去选择当前最快的方式去查询,而不是像Oracle数据那样死板地根据规格去查询. 查询的要求在于快.而对于数据库 ...

  8. leetcode 刷题日志 2018-03-26

    58. 最后一个单词的长度 分析:找最后一个非空格,向前找 int lengthOfLastWord(string s) { int i = s.find_last_not_of(' '); int ...

  9. 2-sat 分类讨论 UVALIVE 3713

    蓝书326 //看看会不会爆int!数组会不会少了一维! //取物问题一定要小心先手胜利的条件 #include <bits/stdc++.h> using namespace std; ...

  10. 分块+lazy 或者 线段树+lazy Codeforces Round #254 (Div. 2) E

    E. DZY Loves Colors time limit per test 2 seconds memory limit per test 256 megabytes input standard ...