Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > Вёрстка веб-сайтов > Горизонтальное меню


Автор: starik47 30.7.2013, 14:21
Здравствуйте!
Создал классическое горизонтальное меню, добавил псевдоклассы. Все работает нормально, но при первом включении все пункты меню выглядят, как посещенные (visited). А мне надо, чтобы первый пункт был активным, а остальные - непосещенные (link). Как этого добиться? 
Веб-мвстера, подскажите.

Автор: s1lver 31.7.2013, 11:01
Покажите ваш код?

Автор: starik47 31.7.2013, 11:35
Цитата(s1lver @ 31.7.2013,  11:01)
Покажите ваш код?

Вот код HTML:

Код

<body>
    <header id="main_header">
        <h1>
            <span class="six">Six</span>
            <span class="studios">Studios</span>
        </h1>
        <nav>
            <ul>
                <li><a href="#">Home</a></li>
                <li><a href="#">Services</a></li>
                <li><a href="#">Portfolio</a></li>
                <li><a href="#">Blog</a></li>
                <li><a href="#">Contact</a></li>
            </ul>
        </nav>
    </header>
</body>


А вот CSS:

Код

body {
    width: 1020px;
    margin: 0px auto;
    padding: 0px;
    position: relative;
}
article, aside, footer, header, menu, nav, section {
    display: block;
}
#main_header {
        height: 66px;
        background: url(img/bgr_header.jpg) repeat-x;
    }
    #main_header > h1 {
        background: url(img/icon.gif) no-repeat 75px 22px;
        float: left;
    }
        #main_header span {
            text-align: left;
            margin-left: 104px;
            line-height: 66px;
            background-color: transparent;
            font-family: Georgia;
            font-size: 27px;
            font-weight: bold;
            font-style: italic;
            letter-spacing: -3px;
        }
        #main_header span.six {
            color: #fff;
        }
        #main_header span.studios {
            color: #f7e5c4;
            margin-left: 1px;
        }
        #main_header > nav {
            width: 435px;
            height: 66px;
            margin-left: 585px;
        }
            #main_header ul {
                margin: 0px;
                padding: 0px;
                list-style: none;
            }
                #main_header li {
                    margin: 0px 8px 0px 0px;
                    float: left;
                }
                    #main_header a {
                        display: block;
                        width: 67px;
                        height: 66px;
                        color: #abaaaa;
                        font: bold 11pt/66px arial;
                        text-decoration: none;
                        text-align: center;
                    }
                        #main_header a:link {
                            color: #abaaaa;
                        }
                        #main_header a:visited {
                            color: #a020a0;
                        }
                        #main_header a:focus {
                            color: #dbd1be;
                            background: url(img/img_nav.jpg) no-repeat 0px 17px;
                        }
            #main_header a:hover {
                            color: #f00;
                        }
                        #main_header a:active {
                            color: #dbd1be;
                            background: url(img/img_nav.jpg) no-repeat 0px 17px;
                        }

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)