zoukankan      html  css  js  c++  java
  • css实现导航栏鼠标移入下划线特效

    .nav ul li:after {
        content: "";
        display: inline-block;
        position: absolute;
        left: 50%;
        bottom: 0;
        width: 0;
        height: 3px;
        -webkit-border-radius: 1.5px;
        -moz-border-radius: 1.5px;
        -ms-border-radius: 1.5px;
        -o-border-radius: 1.5px;
        border-radius: 1.5px;
        background: #eb0001;
        /* background: -webkit-linear-gradient(left, #ED3B47 0%, #0C2B47 100%); */
        background: -moz-linear-gradient(left, #ED3B47 0%, #0C2B47 100%);
        background: -ms-linear-gradient(left, #ED3B47 0%, #0C2B47 100%);
        background: -o-linear-gradient(left, #ED3B47 0%, #0C2B47 100%);
        /* background: linear-gradient(to right, #ED3B47 0%, #0C2B47 100%); */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#ED3B47, endColorstr=#0C2B47, GradintType=0 );
        /* -webkit-box-shadow: 0px 5px 5px rgba(228,0,52,.13); */
        -moz-box-shadow: 0px 5px 5px rgba(228,0,52,.13);
        -ms-box-shadow: 0px 5px 5px rgba(228,0,52,.13);
        -o-box-shadow: 0px 5px 5px rgba(228,0,52,.13);
        box-shadow: 0px 5px 5px rgba(228,0,52,.13);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        -webkit-transition: .5s;
        -moz-transition: .5s;
        -ms-transition: .5s;
        -o-transition: .5s;
        transition: .5s;
    }
  • 相关阅读:
    activiti初学
    Python微信跳一跳外挂
    Linux下将Mongodb单机升级至副本集
    Linux安装Mongodb4.2
    Python3 acm基础输入输出
    Nginx安装图片模块出错,提示fatal error: curl/curl.h
    基于Redis的分布式锁两种实现方式
    Nginx常用模块安装命令
    Nginx安装Nginx-echo模块
    Nginx使用图片处理模块
  • 原文地址:https://www.cnblogs.com/xinlvtian/p/13867620.html
Copyright © 2011-2022 走看看