Thứ Hai, 11 tháng 11, 2019

border-width CSS

#### HTML
<li class="menu-item">
    <a href="#"><span>Nhóm biến áp 1</span></a>
</li>

#### CSS:
.widget-links ul li a:after {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 20px 0 20px 9px;
    border-color: transparent #046393;
    width: 0;
    z-index: 1;
    margin-top: -20px;
    right: -11px;
    top: 50%;
    opacity: 0;
    overflow: hidden;
}
.widget-links ul li a::before {
    content: "›";
    margin-right: 10px;
    position: absolute;
    top: 7px;
    left: 12px;
    color: rgb(4, 99, 147);
}
.widget-links ul li {
    position: relative;
    width: calc(100% - 11px);
}
.widget-links ul li.active a, .widget-links ul li:hover a {
    background-color: #046393;
    color: #fff;
    text-decoration: none;
}

Không có nhận xét nào:

Đăng nhận xét