html： <div class="angle"></div>

css:

 .angle{

   width: 0px;

   height: 0px;

   border-bottom: 50px solid red;

   border-top: 50px solid transparent;

   border-left: 50px solid transparent;

   border-right: 50px solid transparent;

 }

效果：

css三角块的更多相关文章

  1. CSS三角的写法（兼容IE6）

    目录 简介 优点 原理 1. 先创建一个div 2. 然后给div设定边框. 3. 给div的四个边框都设置不同的颜色 4. 把宽度和高度都变成0 5. 其余角为透明 6. 兼容IE6浏览器 造成这样 ...

  2. css构造块级元素

    css 1. 宽高width:数值;height:数值;也可用百分比!长高的设置不会被后代继承2. 背景(1)背景颜色background-color:颜色值;元素的背景颜色默认为transparen ...

  3. 【27前端】在线css三角

    我们都知道利用css边框的属性可以画出三角形,这里为了方便,我做了一个简单的demo页面供大家使用. 在线css三角

  4. CSS包含块containing block详解

    “包含块(containing block)”,W3c中一个很重要的概念,今天带大家一起来好好研究下. 初步理解 在 CSS2.1 中,很多框的定位和尺寸的计算,都取决于一个矩形的边界,这个矩形,被称 ...

  5. css包含块containing block

    <css权威指南>P167: The Containing Block Every element is laid out with respect to its containing b ...

  6. CSS 各类 块级元素 行级元素 水平 垂直 居中问题

    元素的居中问题是每个初学者碰到的第一个大问题,在此我总结了下各种块级 行级 水平 垂直 的居中方法,并尽量给出代码实例. 首先请先明白块级元素和行级元素的区别 行级元素 一块级元素 1 水平居中: ( ...

  7. CSS基础选择器(选择器的优先级)，CSS样式块( 长度/颜色/显示方式/文本样式),盒模型组成，盒模型-block，盒模型布局

    CSS基础选择器 (1)id选择器:   #       =>  标签拥有 id="user"  属性 <style> #user { width: 200px; ...

  8. CSS的块级元素和内联元素的概念

    三生有幸,偶然之下知道了<CSS世界>这本书,让我产生了探究 CSS 的想法. 这里对 CSS 中的块级元素和内联元素的概念做一个简单的整理. 可能对于我们前端开发人员来讲,一般接触到的元 ...

  9. 学习总结：CSS(二)块级与行级元素特性、盒模型、层模型、BUG与BFC、浮动模型

    一.元素的块级与行级特性 在CSS属性display控制元素是否及如何显示的特性,常用的值有none.inline.block.inline-block,在CSS3中还有一些新的特性状态,在这里不做讨 ...

随机推荐

  1. Oracle下载及安装

    Oracle   下载及安装 一.官方下地址:   http://www.oracle.com/technetwork/database/enterprise-edition/downloads/in ...

  2. 关于MultiDataTrigger和MultiTrigger的一些注意事项

    他俩有着相同的语法. 都是在conditions中编写触发条件. 因为都是同一个触发类. 在conditions中有Property和Binding这两个属性.那么这两个可以同时使用吗?当然是不可以的 ...

  3. C# 抽象

    好多人将抽象类也作为多态的一种,其实我觉得并不是特别的好. 抽象在C#中是类的一种表现. 如果将类作为多态,那么前面所有的东西不就白费了吗? C#的 抽象很简单. 那就是抽象. 基本就是高度抽象. 那 ...

  4. 【bzoj1009】: [HNOI2008]GT考试 字符串-kmp-矩阵乘法-DP

    [bzoj1009]: [HNOI2008]GT考试 先用kmp写个暴力 /* http://www.cnblogs.com/karl07/ */ #include <cstdlib> # ...

  5. 返回类型和 return 语句

    return 语句终止当前正在执行的函数并将控制权返回到调用该函数的地方.return 语句有两种形式: return; return expression; 不要返回局部对象的引用或指针: 函数完成 ...

  6. P3480 [POI2009]KAM-Pebbles 阶梯NIM

    $ \color{#0066ff}{ 题目描述 }$ 有N堆石子,除了第一堆外,每堆石子个数都不少于前一堆的石子个数.两人轮流操作每次操作可以从一堆石子中移走任意多石子,但是要保证操作后仍然满足初始时 ...

  7. UICollectionView 如何定制每个Cell的Size

    最新用UICollectionView遇到挺多坑,差点让我废寝忘食了,虽然UICollectionView 逼格比UITableView高,但是真正想定制起来,特别是刚开始是用,真麻痹的到处都是坑,弄 ...

  8. [JSOI2009]计数问题 二维树状数组BZOJ 1452

    题目描述 一个n*m的方格,初始时每个格子有一个整数权值.接下来每次有2种操作: 改变一个格子的权值: 求一个子矩阵中某种特定权值出现的个数. 输入输出格式 输入格式: 第一行有两个数N,M. 接下来 ...

  9. audio.play dom对象 JQ不支持play

    */        PausePlayVoice:function() {            $("#spPauseAudio").click(function() {     ...

  10. 008 Android activity实现多个界面的相互跳转（主要利用Intent）

    1.activity介绍 一个activity就把他理解成一个页面 2.新建activity流程 如图所示在com.lucky.test06的目录下,右击new--->Activity---&g ...