Данный эффект можно использовать в меню или списках. Он представляет собой простую комбинацию верхней и нижней частей обводки с различными оттенками фонового цвета. Нужно помнить, что селекторы CSS first-child и last-child не поддерживаются старыми браузерами. Для обхода такой неприятной ситуации можно использовать jQuery.

#indented ul{
    margin: 20px 0; padding: 0;
    list-style: none;
}
#indented ul li {
    border-top: 1px solid #333;
    border-bottom: 1px solid #111;
}
#indented ul li:first-child {border-top: none;}
#indented ul li:last-child {border-bottom: none;}
#indented ul li a {
    padding: 10px;
    display: block;
    color: #fff;
    text-decoration: none;
}
#indented ul li a:hover {background: #111;}

Добавлено: 18 Апреля 2018 16:34:29 Добавил: Андрей Ковальчук Нравится 0

Добавить