• 单标签实现气泡三角形


    单标签实现气泡三角形

    tooltip  popup气泡弹出层

    这是悬浮的时候,经常出现的  气泡三角

    <style>
    .comment {
    150px;
    height: 35px;
    position: relative;
    margin: 30px auto 0;
    background: #f8ac09;
    border-radius: 5px;
    }

    .comment:after {
    content: '';
    0;
    height: 0;
    position: absolute;
    top: 5px;
    left: -16px;
    border: solid 8px;
    border-color: transparent transparent transparent #f8ac09;
    transform: rotate(-180deg);
    -ms-transform:rotate(-180deg);
    -moz-transform:rotate(-180deg);
    -webkit-transform:rotate(-180deg);
    -o-transform:rotate(-180deg);
    font-size: 0;
    }
    </style>

    <div class="comment"></div>

    即可实现,使用伪类元素实现三角形。

    参考了网络很多资源,大漠的和旭神的网站有很多精讲的。

    下载链接http://files.cnblogs.com/files/leshao/%E5%8D%95%E6%A0%87%E7%AD%BE%E5%AE%9E%E7%8E%B0%E4%B8%89%E8%A7%92%E6%B0%94%E6%B3%A1.rar

  • 相关阅读:
    高性能无锁队列,代码注释
    阿里mysql同步工具otter的docker镜像
    webgl鱼眼算法
    国际网络环境对库的影响
    newlisp
    java面试之数据库
    java面试之遇到过的问题
    java面试之springboot
    git常用命令
    java面试之jenkins
  • 原文地址:https://www.cnblogs.com/leshao/p/7029139.html
Copyright © 2020-2023  润新知