Главная | Случайная
Обратная связь

ТОР 5 статей:

Методические подходы к анализу финансового состояния предприятия

Проблема периодизации русской литературы ХХ века. Краткая характеристика второй половины ХХ века

Ценовые и неценовые факторы

Характеристика шлифовальных кругов и ее маркировка

Служебные части речи. Предлог. Союз. Частицы

КАТЕГОРИИ:






Горизонтальная панель навигации на основе списка с использованием цвета




Воспользовавшись объявлением display: inline, можно сделать так, чтобы списки являлись плоскими, то есть отображались горизонтально, как в примере.

<HTML>

<HEAD>

<TITLE>факультеты МИЭМП</TITLE>

<STYLE>

body{font: 14px "Times New Roman"; color: black}

ul#navlist{margin-left: 0; padding-left: 0; white-space: nowrap}

#navlist li{display: inline; list-style-type: none}

#navlist a{padding: 3px 10px}

#navlist a:link{color: red; background-color: orange; text-decoration: none}

#navlist a:visited{color: blue; background-color: yellow; text-decoration: none}

#navlist a:hover {color: orange; background-color: red; text-decoration: none}

</STYLE>

</HEAD>

<BODY>

<DIV id="navcontainer">

<UL id="navlist">

<LI><A href="econom.html">ФЭФ</A></LI>

<LI><A href="menegment.html">ФУ</A></LI>

<LI><A href="low.html">ЮФ</A></LI>

</UL>

</DIV>

</BODY>

</HTML>

В результате будет получена очень красивая горизонтальная панель навигации, как показано на рисунке.




Не нашли, что искали? Воспользуйтесь поиском:

vikidalka.ru - 2015-2019 год. Все права принадлежат их авторам! Нарушение авторских прав | Нарушение персональных данных