нужна помощь CSS для неупорядоченного списка - PullRequest
4 голосов
/ 29 марта 2011

Я пытаюсь создать базовую панель навигации, используя неупорядоченный список, но по какой-то причине я не могу убрать маркеры.

Я искал решение в Google и мне егоПохоже, что это ДОЛЖНО работать, но я думаю, что я могу испортить что-то, что не связано со стилем ul, что, в свою очередь, препятствует применению стиля ul.

Вот соответствующийHTML:

<div id="nav">
    <ul>
        <li><a href="index.html">Home</a></li>
        <li><a href="about.html">About Us</a></li>
        <li><a href="example.html">Examples</a></li>
        <li><a href="contact.html">Contact Us</a></li>
    </ul>
</div>

и вот CSS:

#nav ul
{
    list-style-type: none;
    position: absolute;
    top: 10px;
    right: 0;
    margin: 0;
    padding: 0;
}
#nav ul li
{
    float: left;
}
#nav ul li a
{
    display: inline;
    float: left;
    padding: 8px 5px 3px 5px;
    margin-right: 5px;
    background-color: #034a7f;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
}
#nav ul li a:hover
{
    padding-top: 12px;
    background-color: #075a97;
}

Ответы [ 4 ]

7 голосов
/ 29 марта 2011

Просто чтобы быть уверенным, я обычно применяю его и к li s:

#nav ul li
{
    list-style-type: none;
    float: left;
}

Еще кое-что нужно проверить, это использовать такой инструмент, как firebug для firefox и прямо-нажмите элемент списка и выполните «осмотр элемента».Оттуда вы можете увидеть стили, которые на самом деле применяются к нему и откуда они берутся, какие переопределяют какие и т. Д.

Скорее всего, что происходит (с другим ответом и комментарием), это то, что выУ меня есть какой-то другой стиль, из-за которого появляются пули - вот где Firebug действительно поможет вам.

0 голосов
/ 29 марта 2011

Это то, что я использую для моей горизонтальной строки меню с использованием CSS. У меня никогда не было с этим проблем.

    #nav {
    padding-bottom: XXpx;
    margin:0px auto;
    }
    #nav ul { list-style:none;
    padding: XXpx;
    margin: XXpx;
    }
    #nav ul li {
    float:left;
    }
    #nav span {
    position:absolute;
    left:-9999px;
    } 
0 голосов
/ 29 марта 2011

Работает. У вас может быть другое правило, которое отменяет #nav ul. Вы можете проверить это, добавив

body #nav ul
0 голосов
/ 29 марта 2011

Я тоже не вижу пуль.возможно, попробуйте полное обновление: CTRL + F5 или CTRL + R. И вы можете попробовать это css

#nav ul li{ list-style: none; }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...