Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.53/15: Рейтинг темы: голосов - 15, средняя оценка - 4.53
 Аватар для CSharp
51 / 51 / 14
Регистрация: 12.01.2013
Сообщений: 779

Подсветка меню

24.08.2014, 08:59. Показов 3161. Ответов 4
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Верстаю шаблон, учусь верстать, не судите строго, я не могу понять как сделать подстветку меню, и как сделать так что бы у последнего пункта меню не было полоски, вот скрин
Название: верстка.png
Просмотров: 97

Размер: 29.6 Кб
вот код, только не весь
HTML
Кликните здесь для просмотра всего текста
HTML5
1
2
3
4
5
6
7
8
9
10
11
<div class = "menu">
                           <ul>
                             <li> <a href = "#">Главная</a> </li>
                             <li> <a href = "#"> Форум </a> </li>
                             <li> <a href = "#"> Об автори </a> </li>
                             <li> <a href = "#"> Изображение </a> </li>
                             <li> <a href = "#"> Видео </a> </li>
                             <li> <a href = "#"> Статьи </a> </li>
                             <li><a href = "#">Наши партнеры</a></li>
                           </ul>
                        </div>

CSS код МЕНЮ
Кликните здесь для просмотра всего текста
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
.menu
{
  background-color: #fff;
  width: 175px;
  margin: 25px 130px  0;
  border: 1px solid #e7d3bc;
   border-radius: 8px;
   line-height:
}
.menu ul
{
   padding: 25px 17px 17px 32px;
   list-style:none;
}
.menu ul li a 
{
  text-decoration: none;
  font: bold 11pt Trebuchet MS;
  color: #000000;
}
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
24.08.2014, 08:59
Ответы с готовыми решениями:

Подсветка меню
Ребят, как можно осуществить подсветку как у этого меню?

Не правильная подсветка меню
Не правильно работает подсветка меню. Сайт http://eurookna.company В шапке сайта есть меню, когда наводишь на него то цвет меню зеленый...

Подсветка текущего пункта меню
Всем привет. Уже 2 недели бьюсь над наверное для кого-то (но не для меня) простой проблемой - выделение пункта главного меню, где нахожусь...

4
 Аватар для maximus2011
269 / 261 / 35
Регистрация: 21.02.2012
Сообщений: 1,078
24.08.2014, 09:48
CSS
1
2
3
.menu ul li a:hover{
    background:#FFEEC6;
}
если бордер нижний прописан у элемента li

CSS
1
2
3
.menu ul li:last-child{
    border-bottom:none;
}
если у a

CSS
1
2
3
.menu ul li:last-child a{
    border-bottom:none;
}
1
 Аватар для CSharp
51 / 51 / 14
Регистрация: 12.01.2013
Сообщений: 779
24.08.2014, 10:08  [ТС]
Цитата Сообщение от maximus2011 Посмотреть сообщение
если бордер нижний прописан у элемента li
подскажите как сделать что бы была полоска снизу, я ее выризал
вот код
CSS
1
2
3
4
.menu ul li
{
     background-image: url("../img/p.png") center top no-repeat;
}
но он почему то не ставиться
0
0 / 0 / 0
Регистрация: 19.08.2014
Сообщений: 13
24.08.2014, 11:22
CSharp, не делайте её картинкой, просто
CSS
1
.menu ul li { border-bottom: 1px solid #000; }
0
 Аватар для fol
511 / 485 / 161
Регистрация: 08.07.2013
Сообщений: 1,714
Записей в блоге: 1
24.08.2014, 12:25
есть такое негласное правило: если можно использовать css, а не картинку, то именно так и делать вплоть сложных элементов. css3 позволяет рисовать много стандартных элементов, реализовывать анимацию и пр. а тут простой бордер - ну никак не картинкой
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
24.08.2014, 12:25
Помогаю со студенческими работами здесь

подсветка меню второго уровня
Уважаемые монстры каскадных стилей, не дайте умереть не поняв ошибки! Учил css , вероятно не в коня корм, глупые проблемы остаются. ...

Подсветка Меню в форме Параллелограмма
Пытаюсь сделать, чтобы при наведении на пункт меню (:hover) фон менялся в форме параллелограмма получается калично как-то делаю...

Подсветка активного пункта меню
Доброго времени суток! Народ помогите сделать подсветку активного пункта меню, пробовал через focus и activ но нечего не происходит вот...

Как добавить выплывающее меню к уже готовому горизонтальному меню (не меняя дизайн горизонтального меню)?
&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;&gt; &lt;html...

Подсветка изображения
Здравствуйте, очень нужна Ваша помощь. Есть макет http://maket.com.ua/1303/VIKI.IN.UA/B1-2.7.html. Там где помещены четыре фотографии...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
SDL3 для Web (WebAssembly): Основы отладки веб-приложений на SDL3 по USB и Wi-Fi, запущенных в браузере мобильных устройств
8Observer8 07.02.2026
Содержание блога Браузер Chrome имеет средства для отладки мобильных веб-приложений по USB. В этой пошаговой инструкции ограничимся работой с консолью. Вывод в консоль - это часть процесса. . .
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве
8Observer8 02.02.2026
Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .
Философия технологии
iceja 01.02.2026
На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .
SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf
8Observer8 01.02.2026
Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .
SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли
8Observer8 30.01.2026
Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm
8Observer8 30.01.2026
Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .
SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 29.01.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .
Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT
bedvit 28.01.2026
Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru