1.  
      <view class="hd"></view>.hd {
    2.  
      content: "";
    3.  
      height: 16rpx;
    4.  
      width: 16rpx;
    5.  
      border-width: 4rpx 4rpx 0 0;
    6.  
      border-color: red;
    7.  
      border-style: solid;
    8.  
      transform: rotate(-45deg);
    9.  
      position: absolute;
    10.  
      top: 20rpx;
    11.  
      left: 30rpx;
    12.  
      }
    13.  
      .hd:hover {
    14.  
      transform: rotate(135deg);
    15.  
    16. 重点是：content 设置为空

效果CSS实现三角的更多相关文章

  1. css实现三角的一些方法

    css实现三角没有想象中的那么难,只要明白border的各种属性的意思就很好明白css三角是如何实现的. 一下是几个很简单的例子:   css三角形状的制作:     css样式:    .trian ...

  2. 使用css实现三角符号

    关于使用css制作三角符号,网上有很多的例子了,在这里只是为了详细的向各位解释一下三角符号的原理 下图,是一个长宽为100px,边框宽度为100px的一个元素,由此可见,在css中上下左右的边框相交处 ...

  3. 使用css制作三角

    1. 字符实现三角效果关于字符实现三角我早在09年的时候就介绍了:使用字符实现兼容性的圆角尖角效果.一转眼两年过去了,这个技术开始被越来越多的人所熟知.使用的字符是正棱形“◆”字符,编码表示为◆ . ...

  4. css实现三角箭头（兼容IE6)

    纯css实现三角箭头有几种方式,常规的方式用css3的rotate把元素旋转45度角,无法兼容ie的主要原因是ie不支持边框透明, 第二种方法,使用chroma滤镜透明,经尝试在ie下会出现activ ...

  5. 爱心跳动效果 CSS实现

    爱心跳动效果 CSS实现 实现效果 砰砰砰 实现原理 通过动画改变每个元素的高度,从而实现每个元素高度变化的效果,为了使每个元素依次跳动,给每个元素添加一定的延时效果,使得从效果元素依次跳动 代码分析 ...

  6. css实现三角效果

    demo     <!DOCTYPE html> <html lang="zh"> <head> <meta charset=utf-8& ...

  7. 用css 制作三角

    html代码: <div class="div"></div> css代码: .div{ border-top:40px solid #ff0077; bo ...

  8. css倒三角的几种实现方式

    在网页中,你在很多地方都能看到倒三角,比如tooltips,下拉菜单等.大家有几种方式来实现呢? 1.BASE64编码 图片 假如你已经有了三角形的图片,并且减少HTTP请求,那么将这个图片转换成一个 ...

  9. CSS border三角、圆角图形生成技术简介

    http://www.zhangxinxu.com/wordpress/?p=794 一.前言 利用CSS的border属性可以生成一些图形,例如三角或是圆角.纯粹的CSS2的内容,没有兼容性的问题, ...

随机推荐

  1. (转)Mysql占用过高CPU时的优化手段

    Mysql占用CPU过高的时候,该从哪些方面下手进行优化?占用CPU过高,可以做如下考虑:1)一般来讲,排除高并发的因素,还是要找到导致你CPU过高的哪几条在执行的SQL,show processli ...

  2. DesUtils工具类

    public final class DesUtils { private static final String DES = "DES"; private static fina ...

  3. 19.Class的基本语法

    1.简介 JavaScript 语言中,生成实例对象的传统方法是通过构造函数. function Point(x, y) { this.x = x; this.y = y; } Point.proto ...

  4. linux下的ps命令

    ps命令用于报告当前系统的进程状态.可以搭配kill指令随时中断.删除不必要的程序.ps命令是最基本同时也是非常强大的进程查看命令,使用该命令可以确定有哪些进程正在运行和运行的状态.进程是否结束.进程 ...

  5. TensorFlow架构与设计：概述

    TensorFlow是什么? TensorFlow基于数据流图,用于大规模分布式数值计算的开源框架.节点表示某种抽象的计算,边表示节点之间相互联系的张量. TensorFlow支持各种异构的平台,支持 ...

  6. WPF中后台代码停止RepeatBehavior=RepeatBehavior.Forever的办法

    1.在使用Begin()方法启动动画的时候,要将isControlable设置成true,就是Begin方法的第二个参数  scanningStoryBoard.Begin(this,true);// ...

  7. Java的访问权限(public并不等于默认)

    一共有四种访问权限,对应四个范围 1.private :只有本类内可以使用,即使是子类也没权使用 2.protect :子类和友好类能够使用,继承中经常用到 3.默认值,(就是什么都没写),只有同包名 ...

  8. mysql修改root密码和对连接授权

    mysql修改root密码 首先 mysql -uroot -p 进入mysql界面后执行 set password for root@localhost = password('111111');  ...

  9. ajax从零基础到实战

    一. 什么是AJAX? ajax是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. 二. 在项目中怎么运用AJAX? 项目主要文件夹目录有img文件夹,css文件夹,js文件夹,如果你要运 ...

  10. 浅谈FileReader

    FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用 File 或 Blob 对象指定要读取的文件或数据. 了解https://develope ...