.record-left{

content: "";

width: 0;

height: 0;

float: left;

border-top: 10px solid transparent;

border-right: 10px solid red;

border-bottom: 10px solid transparent;

margin-top:5px;

}

.record-right{

content: "";

width: 0;

height: 0;

float: right;

border-top: 10px solid transparent;

border-left: 10px solid red;

border-bottom: 10px solid transparent;

margin-top:5px;

margin-right: 25px;

}

css左右箭头的更多相关文章

  1. 用CSS绘制箭头等三角形图案 [译]

    最近重新设计了我的网站,准备添加tooltips提示信息效果.实现很容易,但我想要让提示功能具有三角形的指示图标.当我重新思考想要所设计的每个图标颜色都随心所欲的时候,采用图片那就是一场灾难.幸运的是 ...

  2. 纯CSS实现箭头、气泡让提示功能具有三角形图标（简单实例）

    <style type="text/css"> /*向上箭头,类似A,只有三个边,不能指定上边框*/ .arrow-up { width: 0px; height: 0 ...

  3. css指示箭头两种实现方法

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

  4. CSS实现箭头效果

    有时候网页中使用箭头以增强效果,一般的做法是使用图片,今天我们使用CSSCSS来实现“箭头效果”,使用CSS我们必须兼容所有浏览器(IE6.7.8.9.10.+),Chrome,Firefox,Ope ...

  5. CSS画一个三角形，CSS绘制空心三角形，CSS实现箭头

     壹 ❀ 引 这两天因为项目工作较少,闲下来去看了GitHub上关于面试题日更收录的文章,毕竟明年有新的打算.在CSS收录中有一题是 用css创建一个三角形,并简述原理 .当然对于我来说画一个三角形是 ...

  6. css写箭头

    /* 向上的箭头 */ .dot-top { font-size: 0; line-height: 0; border-width: 10px; border-color: red; border-t ...

  7. css 画箭头

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  8. 用CSS制作箭头的方法

     一.箭头产生的原理 #demo12 { border: 100px solid; border-color:green blue orange red; width:100px; height:10 ...

  9. 纯css实现箭头

    很久之前收集的,忘记出处了. 1.梯形: 当元素宽.高和边框的宽相近(等)时,改变某一边的颜色可以看到一个梯形: border: 10px solid #000; border-left-color: ...

  10. Css绘制箭头

    IE6不支持transparent,因此上面的代码在IE6加一点处理透明的hack,修改后的代码如下 IE6下处理transparent   border-left:100px solid trans ...

随机推荐

  1. memcached简单介绍及在django中的使用

    什么是memcached? Memcached是一个高性能的分布式的内存对象缓存系统,全世界有不少公司采用这个缓存项目来构建大负载的网站,来分担数据库的压力.Memcached是通过在内存里维护一个统 ...

  2. HDU 4722 Good Numbers（位数DP）（2013 ACM/ICPC Asia Regional Online ―― Warmup2）

    Description If we sum up every digit of a number and the result can be exactly divided by 10, we say ...

  3. HDU 3699 A hard Aoshu Problem（暴力枚举）（2010 Asia Fuzhou Regional Contest）

    Description Math Olympiad is called “Aoshu” in China. Aoshu is very popular in elementary schools. N ...

  4. spring-data-jpa 简单使用心得

    对于总是使用mybatis的我,突发奇想的想使用spring-data-jpa搭一个小环境,这几天处处碰壁,现总结如下: 环境采用springboot maven需要导入: <dependenc ...

  5. 使用window.getSelection()获取div中选中文字内容及位置

    div添加一个弹出事件: $(document).ready(function () { $("#marked-area").mouseup(function (e) { $sco ...

  6. 玩转VFS（二）

    关于VFS的第一篇中已经太长了 http://www.cnblogs.com/honpey/p/6348914.html 另起一篇: 1)如何在kernel里找到目前文件系统中的根目录: 2) 如何能 ...

  7. click & copy

    click & copy https://github.com/zenorocha/clipboard.js/issues/604 https://github.com/zenorocha/c ...

  8. 【bzoj3813】奇数国 线段树

    题目描述 给出一个长度为n的序列,每个数都可以由前60个质数的乘积表示,初始每个数都是3.支持两种操作:(1)修改一个数 (2)查询一段区间内所有数的乘积的欧拉函数值模19961993. 输入 第一行 ...

  9. ASP.NET页面之间传值Cookie(3)

    这个也是大家常使用的方法,Cookie用于在用户浏览器上存储小块的信息,保存用户的相关信息,比如用户访问某网站时用户的ID,用户的偏好等, 用户下次访问就可以通过检索获得以前的信息.所以Cookie也 ...

  10. CF451E Devu and Flowers 解题报告

    CF451E Devu and Flowers 题意: \(Devu\)有\(N\)个盒子,第\(i\)个盒子中有\(c_i\)枝花.同一个盒子内的花颜色相同,不同盒子的花颜色不同.\(Devu\)要 ...