扒segmentfault的导航栏时候发现的,用了个span标签写了个三角形出来,第一次发现,好神奇,查了下还有挺多种玩法的。基本的用法就是将盒子的width和height设为0,然后用border搭配transparent去实现不同方向的三角形。

http://caibaojian.com/css-border-triangle.html

http://www.cnblogs.com/blosaa/p/3823695.html

http://www.jb51.net/article/42513.htm

纯CSS绘制三角形的更多相关文章

  1. CSS 魔法系列:纯 CSS 绘制三角形(各种角度)

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

  2. CSS学习笔记(8)--纯CSS绘制三角形(各种角度)

    纯CSS绘制三角形(各种角度) CSS三角形绘制方法,学会了这个,其它的也就简单.   我们的网页因为 CSS 而呈现千变万化的风格.这一看似简单的样式语言在使用中非常灵活,只要你发挥创意就能实现很多 ...

  3. 纯Css绘制三角形箭头三种方法

    在制作网页的过程中少不了绘制类似图片的三角形箭头效果,虽然工程量不大,但是确实麻烦.在学习的过程中,总结了以下三种方法,以及相关的例子. 一.三种绘制三角形箭头方法 1.方法一:利用overflow: ...

  4. 纯CSS绘制三角形(各种角度)

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

  5. 纯CSS绘制三角形(各种角度)类似于使用字符画法,根据位移不同,也可以使用两个元素画出三角边框

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

  6. 纯 CSS 绘制三角形(各种角度)

     转载:https://www.cnblogs.com/lhb25/p/css-and-css3-triangle.html       Triangle Up #triangle-up { widt ...

  7. CSS 魔法系列:纯 CSS 绘制图形(各种形状的钻石)

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

  8. 纯CCS绘制三角形箭头图案

    用CSS绘制三角形箭头.使用纯CSS,你只需要很少的代码就可以创作出各种浏览器都兼容的三角形箭头! CSS代码: /* create an arrow that points up */ div.ar ...

  9. 摘记 史上最强大的40多个纯CSS绘制的图形(一)

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

随机推荐

  1. Red and Black(简单dfs)

    Red and Black Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Tot ...

  2. LED音乐频谱之输出数据处理

    转载请注明出处:http://blog.csdn.net/ruoyunliufeng/article/details/38023539 一.PWM调节 1.初始化 void DACInit() { C ...

  3. ARM LDR伪指令使用方法具体解释

    LDR伪指令 10.45 LDR pseudo-instruction   功能:把一个32位马上数或一个32位的内存地址载入到一个寄存器中. 注意:这里描写叙述的是LDR伪指令,而不是LDR指令   ...

  4. lua 类继承和实现

    http://blog.csdn.net/ssihc0/article/details/7742323 Account={balance=}; --新建了一个对像,他有一个属性balance func ...

  5. 使用spring 并加载模板发送Email 发邮件 java 模板

    以下例子是使用spring发送email,然后加载到固定的模板,挺好的,大家可以试试 需要使用到spring-context 包 和 com.springsource.org.apache.veloc ...

  6. Android应用程序组件Content Provider的启动过程源代码分析

    文章转载至CSDN社区罗升阳的安卓之旅,原文地址:http://blog.csdn.net/luoshengyang/article/details/6963418 通过前面的学习,我们知道在Andr ...

  7. JAVA HashMap与HashTable 区别

    HashTable和HashMap区别 第一,继承不同. public class Hashtable extends Dictionary implements Mappublic class Ha ...

  8. A child container failed during start 解决方案

    症状:A child container failed during start 适用问题描述:tomcat挂空可以正常运行,载入项目时挂掉. 相关操作:之前为了省事,由于两个servlet功能类似所 ...

  9. 重写TextView,实现圆形背景,文本居中显示

    最近,在做考试试题排版,产品提出题号希望显示成圆形背景,序号文本居中显示. (有点问题:文本没有绝对居中,暂时没做处理.) 为此,我采取的方式是重写TextView的onDraw方法,绘制一个圆形背景 ...

  10. react tab选项卡切换

    Tab选项卡切换是个很常见也很简单的小功能,用原生js和jq去写的话可能不到20行代码就搞定so easy.但是用react去实现就没那么容易了(是自己react比较菜).由于最近在重新学习react ...