Верстка шаблона

@Fene4ka_ · Регистрация: 24.01.2014

Студворк — интернет-сервис помощи студентам

Подскажите плз, как сделать у верхней панели навигации эти палочки

@Fedor92 · 31.10.2014, 00:05

Вырежьте палочки и вставьте в дивы бэкгроундом между пунктами меню...

@Fene4ka_ · 31.10.2014, 23:22 **[ТС]**

ребят, помогите доверстать сайт

шаблон залит выше, а вот то, что у меня получилось

@belltone · 01.11.2014, 02:47

Сделать их изображениями и скрыть отображение в начале и в конце.

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
@import url([url]http://fonts.googleapis.com/css?family=Expletus+Sans:500);
* { 
    margin:0 auto;
    padding:0;
}
.navigation {
    font:500 15px 'Expletus Sans', cursive;
    height:63px;
    background: #003f53; /* Old browsers */
    background: -moz-linear-gradient(top,  #003f53 0%, #002c3b 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#003f53), color-stop(100%,#002c3b)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #003f53 0%,#002c3b 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #003f53 0%,#002c3b 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #003f53 0%,#002c3b 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #003f53 0%,#002c3b 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003f53', endColorstr='#002c3b',GradientType=0 ); /* IE6-9 */
    padding-left:31px;
}
ul li {
    list-style:none;
    float:left;
    background:url(separate.gif) no-repeat center left;
    padding:0px 1px;
}
ul li:first-child {
    background:none;
}
a {
    color:white;
    text-transform:uppercase;
    text-decoration:none;
    padding:22px 17.4px 22px 17.4px;
    display:block;
}
a:hover {
    background: #002c3b; /* Old browsers */
    background: -moz-linear-gradient(top,  #002c3b 0%, #003f53 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#002c3b), color-stop(100%,#003f53)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #002c3b 0%,#003f53 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #002c3b 0%,#003f53 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #002c3b 0%,#003f53 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #002c3b 0%,#003f53 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002c3b', endColorstr='#003f53',GradientType=0 ); /* IE6-9 */
}

HTML5
1
2
3
4
5
6
7
8
9
10
<div class="navigation">
<ul>
    <li><a href="#">About</a></li>
    <li><a href="#">Courses</a></li>
    <li><a href="#">Programs</a></li>
    <li><a href="#">Teachers</a></li>
    <li><a href="#">Admission</a></li>
    <li><a href="#">Contacts</a></li>
</ul>
</div>

@Fene4ka_ · 01.11.2014, 23:44 **[ТС]**

belltone, а не могли бы вы это добавить в мой проект ?

Добавлено через 9 часов 22 минуты
а как мне добавить градиент на верхнее меню по середине ?

Новые блоги и статьи Все статьи Все блоги /
Символьное дифференцирование igorrr37 13.02.2026 / * Логарифм записывается как: (x-2)log(x^2+2) - означает логарифм (x^2+2) по основанию (x-2). Унарный минус обозначается как ! в-строка - входное арифметическое выражение в инфиксной(обычной). . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .

@Fedor92 2964 / 2621 / 1068 Регистрация: 15.12.2012 Сообщений: 10,091 Записей в блоге: 11
	31.10.2014, 00:05
	Вырежьте палочки и вставьте в дивы бэкгроундом между пунктами меню... 0

@Fene4ka_ 102 / 102 / 40 Регистрация: 24.01.2014 Сообщений: 1,242
	01.11.2014, 23:44 [ТС]
	belltone, а не могли бы вы это добавить в мой проект ? Добавлено через 9 часов 22 минуты а как мне добавить градиент на верхнее меню по середине ? 0