#triangle-up {
width:;
height:;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 100px solid red;
}

#triangle-down {
width:;
height:;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 100px solid red;
}

#triangle-left {
width:;
height:;
border-top: 50px solid transparent;
border-right: 100px solid red;
border-bottom: 50px solid transparent;
}

#triangle-right {
width:;
height:;
border-top: 50px solid transparent;
border-left: 100px solid red;
border-bottom: 50px solid transparent;
}

#triangle-topleft {
width:;
height:;
border-top: 100px solid red;
border-right: 100px solid transparent;
}

#triangle-topright {
width:;
height:;
border-top: 100px solid red;
border-left: 100px solid transparent;
}

#triangle-bottomleft {
width:;
height:;
border-bottom: 100px solid red;
border-right: 100px solid transparent;
}

#triangle-bottomright {
width:;
height:;
border-bottom: 100px solid red;
border-left: 100px solid transparent;
}

[CSS3] 各种角度的三角形绘制的更多相关文章

  1. 【CImg】三角形绘制算法实现

    这周的CV基础练习是简单的图形绘制:比如说矩形.三角形和圆心什么的.会发现其实矩形和圆形的实现思路都很直白,矩形只需要确认两个对角坐标就可以了,圆心只需要确认圆心和半径,接着就是简单的遍历各个像素点判 ...

  2. 用CSS3实现带小三角形的div框(不用图片)

    现在看到了很多带小三角形的方框,如微信.Mac版的QQ.QQ空间的时间轴等等,在聊天或者是发表的状态的内容外面都有一个带小三角形的矩形框包围着,感觉看着很不错,于是决定亲自动手写一个,我上次用的是偏移 ...

  3. CSS 利用border三角形绘制方法

    CSS 三角形绘制方法,这里面的transparent比较重要,有和没有影响很大: 原理:这个div是由4个三角形组成,每个三角对应一个border,隐藏其它3个border,就可以得到一个三角形. ...

  4. OpenglEs之三角形绘制

    在前面我们已经在NDK层搭建好了EGL环境,也介绍了一些着色器相关的理论知识,那么这次我们就使用已经搭配的EGL绘制一个三角形吧. 在Opengl ES的世界中,无论多复杂的形状都是由点.线或三角形组 ...

  5. css三角形绘制

    三角形演变: 1.将一个块元素的宽.高都设置为0,再设置边框样式,得如下效果图(绿色部分): 样式: {;;border: 35px solid #7de87d;} 通过此样式得到的是一个正方形. 2 ...

  6. OpenGL ES 3.0 点,线,三角形绘制形式总结

    OpenGL ES 3.0 顶点     -1,  1, 0, -0.5f,  0, 0,     0, -1, 0,    -1,  0, 0, 0.5f,   0, 0,     1, -1,   ...

  7. 3D引擎为什么使用三角形绘制曲面

    这个问题是我第一次接触3D开发就有的疑问,最近在看<游戏引擎架构>(Game Engine Architecture),在书中找到了答案. 三角网格(Triangle Mesh),游戏开发 ...

  8. 利用CSS3中transparent实现三角形及三角形组合图

    ??如何绘制三角形及三角形的组合图案,以下是自己画的草图 源码如下 <!DOCTYPE html> <html lang="en"> <head> ...

  9. 利用css3特性写出三角形(兼容IE浏览器)

    利用CSS写出三角形的效果 效果如图: 代码如下: .triangle-up { width:0px; height:0px; border-left:10px solid transparent; ...

随机推荐

  1. Python基础语法习题二

    习题: 1.请用代码实现:利用下划线将列表的每一个元素拼接成字符串,li=['alex', 'eric', 'rain'] 2.查找列表中元素,移除每个元素的空格,并查找以a或A开头并且以c结尾的所有 ...

  2. python 迭代器/生成器/迭代对象

    生成器: 带有yield的函数 迭代器:带有next 方法的对象,可以作为内建函数next的参数 迭代对象:带有__iter__方法的对象,__iter__方法返回迭代器 -------------- ...

  3. CLR如何控制类型中的字段排序

    [StructLayout(LayoutKind.Sequential) ]保持字段布局 [StructLayout(LayoutKind.Auto) ]CLR自动选择最优 [StructLayout ...

  4. LevelDB SSTable文件

    [LevelDB SSTable文件] LevelDb不同层级有很多SSTable文件(以后缀.sst为特征),所有.sst文件内部布局都是一样的.上节介绍Log文件是物理分块的,SSTable也一样 ...

  5. SO_KEEPALIVE选项

    [SO_KEEPALIVE选项 ] 对于面向连接的TCP socket,在实际应用中通常都要检测对端是否处于连接中,连接端口分两种情况: 1.连接正常关闭,调用close() shutdown()连接 ...

  6. Hadoop Streaming:aggregate

    [Hadoop Streaming:aggregate] 1.实例1 测试文件test.txt mapper程序: 运行: $hadoop streaming -input /app/test.txt ...

  7. Cocoa Touch(三):图形界面UIKit、Core Animation、Core Graphics

    UIKit 视图树模型 1.视图树模型 计算机图形实际上是一个视图树模型,每个视图都有一个本地坐标系.每个本地坐标系的组成部分是:原点在父坐标系中的位置,每个基在父坐标系中的位置,由此就可以根据向量的 ...

  8. Connection Lifetime

    Connection Lifetime作用(数据库群集)  2010-11-12 14:17:01|  分类: sql server 2005 |  标签: |字号大http://xiangzhang ...

  9. 单词搜索 II · Word Search II

    [抄题]: 给出一个由小写字母组成的矩阵和一个字典.找出所有同时在字典和矩阵中出现的单词.一个单词可以从矩阵中的任意位置开始,可以向左/右/上/下四个相邻方向移动. 给出矩阵: doafagaidca ...

  10. ubuntu登陆无限循环

    现象:在Ubuntu登陆界面输入密码之后,黑屏一闪并且出现了check battery state之类的文字之后,又跳转到登录界面. 原因:主目录下的.Xauthority文件拥有者变成了root,从 ...