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. 协作式取消 CancellationTokenSource

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  2. mono 的System.Data.SqlClient小记录

    厦门-JuzzPig()  15:33:36System.Data.SqlClient 不科学的广州-PC286()  15:33:42webservice 返回的是 xml厦门-JuzzPig()  ...

  3. underscore相关记录

    为什么使用void 0代替undefined? 在很多框架的源码以及webpack打包出来的bundle.js中,我们都可以看到void 0的身影,如下: function generateRando ...

  4. linux MD5 SHA1 等 文件校验方法

    为解决官方发布的软件包被别人更改或者软件在传输过程中出现传输错误等问题,软件官方在提供软件包的同时,还提供一个保存MD5校验码的文件. Linux/unix中可以使用 md5sum 文件名 sha1s ...

  5. redis 数据持久化 aof方式

    redis持久化-Append-only file(缩写aof)的方式 本质:把用户执行的每个  ”写“ 指令(增加.修改.删除)都备份到文件中,还原数据的时候就是执行具体写指令. 打开redis的运 ...

  6. 错误:‘lock_guard’ 在此作用域中尚未声明

    解决:修改报错文件,加入#include <boost/thread/lock_guard.hpp>

  7. JVM的类加载时机

    类加载过程中每个步骤的顺序 我们已经知道,类加载的过程包括:加载.连接.初始化,连接又分为:验证.准备.解析,所以说类加载一共分为5步:加载.验证.准备.解析.初始化. 其中加载.验证.准备.初始化的 ...

  8. Windows Azure上的大数据服务: HDInsight的介绍

    这个视频介绍了目前非常流行的大数据处理框架Hadoop的Windows Azure上的实现:HDInsight,以及利用MapReduce来对大数据进行分析,利用Hive进行查询,利用客户端Power ...

  9. Physik

    0.重点词汇 Der Ortsvektor:位置矢量 Die Verschiebung:位移 Die Geschwendigkeit:速度 Die Beschleunigung:加速度 Die Kre ...

  10. 【Echo】实验 -- 实现 C/C++下UDP, 服务器/客户端 通讯

    本次实验利用UDP协议, 语言环境为 C/C++ 利用套接字Socket编程,实现Server/CLient 之间简单的通讯. 结果应为类似所示: 下面贴上代码(参考参考...) Server 部分: ...