1. Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела
    Скрыть объявление

[Помогите] Сделать кнопку активной

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем kastahhls, 5 фев 2014.

Статус темы:
Закрыта.
  1. kastahhls

    kastahhls

    Регистрация:
    30 дек 2012
    Сообщения:
    114
    Симпатии:
    13
    Здравствуйте!
    Есть такой код
    HTML:
    <div class="topmenu"> 
    
    <ul>
        <li><a href="/"><span><img src="catalog/view/theme/default/image/home_icon.png" alt="Главная" /> Главная </span></a></li>
        <li><a href="/"><span>Доставка</span></a></li>
        <li><a href="/"><span>Оплата</span></a></li>
        <li><a href="/"><span>Сотрудничество</span></a></li>
        <li><a href="/"><span>Акции</span></a></li>
        <li><a href="/contact-us"><span>Контакты</span></a></li>
    </ul>
    </div>
    вот стили к нему:

    Код:
    .topmenu {
        display: block;
        list-style: none;
        margin-top: 40px;
        padding: 0;
        position: absolute;
        top:105px;
        z-index: 65;
    }
    .topmenu ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .topmenu > ul > li {
        float: left;
    }
    .topmenu > ul > li a {
        display: block;
        text-decoration: none;
        color: black;
        border-top: 1px solid transparent;
        border-left: 1px solid transparent;
        border-right: 1px solid transparent;
    }
    .topmenu > ul > li a:hover{
        color: #fff;
        text-decoration: none;
        background: url('../image/bg_top_part-blue.png') 0 0 repeat-x;
        border-top: 1px solid #00b7f5;
        border-left: 1px solid #006b8f;
        border-right: 1px solid #006b8f;
        border-radius: 4px 4px 0 0;
        -moz-border-radius: 4px 4px 0 0;
        -khtml-border-radius: 4px 4px 0 0;
    }
    .topmenu > ul > li a.active {
        color: #fff;
        text-decoration: none;
        background: url('../image/bg_top_part-blue.png') 0 0 repeat-x;
        border-top: 1px solid #00b7f5;
        border-left: 1px solid #006b8f;
        border-right: 1px solid #006b8f;
        border-radius: 4px 4px 0 0;
        -moz-border-radius: 4px 4px 0 0;
        -khtml-border-radius: 4px 4px 0 0;
    }
    .topmenu li a span {
        display: block;
        padding: 11px 17px;
    }
    но при нажатии, к примеру на главную, не получается сделать чтобы кнопка была активной
    Помогите, плиз!
     
  2. GigabiT

    GigabiT

    Регистрация:
    13 фев 2014
    Сообщения:
    28
    Симпатии:
    0
    Попробуй поставь двоеточие перед "active".
     
  3. mytraz

    mytraz

    Регистрация:
    12 фев 2013
    Сообщения:
    102
    Симпатии:
    6
    a:link { color: red } /* unvisited links */
    a:visited { color: blue } /* visited links */
    a:hover { color: yellow } /* user hovers */
    a:active { color: lime } /* active links */

    все это псевдоклассы и пишутся через :
     
    engineer_pro нравится это.
Статус темы:
Закрыта.