Горизонтальное меню на CSS

ul { float:left; width:100%; padding:0; margin:0; list-style-type:none; } a.nav { float:left; width:6em; text-decoration:none; color:white; background-color:purple; padding:0.2em 0.6em; border-right:1px solid white; } a.nav:hover {background-color:#ff3300;} li {display:inline;}

Мы создадим горизонтальное меню на CSS. Мы позволили элементам ul и a выровняться по левому краю. Элемент li будет отображаться как строчный. Это позволит нам разместить ссылки меню (пункты списка) на одной строке. Элемент ul имеет ширину 100%, а ссылки имеют ширину 6em (6 размеров текущего шрифта). Мы добавили цвета и границ, чтобы это было похоже в конце концов на меню.

Мы создадим горизонтальное меню на CSS. Мы позволили элементам ul и a выровняться по левому краю. Элемент li будет отображаться как строчный. Это позволит нам разместить ссылки меню (пункты списка) на одной строке. Элемент ul имеет ширину 100%, а ссылки имеют ширину 6em (6 размеров текущего шрифта). Мы добавили цвета и границ, чтобы это было похоже в конце концов на меню.