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. 虚拟机下设置CentOS 7使用固定IP地址

    1.设置虚拟机使用桥接网络 2.查看安装虚拟机软件的电脑IP信息 3.启动CentOS 7进行设置

  2. android中画弧函数canvas.drawArc()之理解

    在学习android中图形图像处理技术这部分内容时,对绘制圆弧函数canvas.drawArc()的用法.参数含义及画图原理很是不理解,在网上搜索了一些,加上自己的理解,在此做个小总结,作为学习过程中 ...

  3. shiro学习笔记_0500_授权

    1,授权:给身份认证通过的人,授予他可以访问某些资源的权限. 2,权限粒度:分为粗粒度和细粒度. 粗粒度:例如对 user 的 crud,也就是通常所说的对表的操作. 细粒度:对表中记录的操作.如 只 ...

  4. UBUNTU 无法解析域名 解决方法

    莫名其妙的,ubuntu 无法访问外网. ping www.taobao.com  www.baidu.com 提示无效的主机名 但是ping 外网ip 都是可以PING通的. 所以断定是 dns问题 ...

  5. 对 BOIS 的一些介绍

    BIOS里不可调节CPU将在64/32位系统下工作 知识点延伸1,一般CPU要想在64位状态下运行必须具备两个条件: 1)安装64位操作系统 2)CPU本身就支持64位指令集 知识点延伸2有必要了解B ...

  6. win10+GTX1080+Tensorflow1.6安装

    安装参考网站:http://blog.csdn.net/lp654063449/article/details/79340655 依照安装目录依次安装,所需安装包均已下载,在最后的一步中,打开cuda ...

  7. C#(winform)设置窗口置顶

    只要设置窗体的TopMost属性即可: registerForm.TopMost = true;

  8. ReferenceError: “alert” is not defined

    用Node.js单独运行js文件时,其中定义的alert不可用 alert is not part of JavaScript, it's part of the window object prov ...

  9. switch case :在JDK 7中，又加入了对String类型的支持，从此不用再写If-Else来判断字符串了

    switch的case语句可以处理int,short,byte,char类型的值, 因为short,byte,char都会转换成int进行处理,这一点也可以从生成的字节码看出. char a = 'e ...

  10. python爬虫实战（九）--------拉勾网全站职位（CrawlSpider）

    相关代码已经修改调试成功----2017-4-24 详情代码请移步我的github:https://github.com/pujinxiao/Lagou_spider 一.说明 1.目标网址:拉勾网 ...