Навигатор
Категории раздела
Профиль для ucoz [9]
Новый профиль для ucoz, мини профиль для ucoz, скрипт для ucoz профиль, профиль для сайта ucoz
Ajax для ucoz [15]
Ucoz ajax, ajax окна для ucoz, скрипты ajax для ucoz, новые ajax окна для ucoz, новый вид ajax ucoz
Скрипты для ucoz [136]
скачать скрипты для ucoz, скрипты ucoz
Меню для ucoz [44]
меню для ucoz, горизонтальное меню для ucoz, раздвижное меню ucoz, вертикальное, выпадающие меню ucoz
Календари для ucoz [18]
скрипт календарь cs, скрипт для ucoz календарь, календарь для ucoz cs 1.6, календари ucoz
Часы для ucoz [31]
часы для ucoz, часы для ucoz cs 1.6
Статистика для ucoz [11]
статистика cs для ucoz
Форма входа для ucoz [13]
форма входа для ucoz
Переключатели для ucoz [8]
Переключатели страниц для ucoz
Шапки для ucoz [13]
шапки для ucoz cs 1.6
Раскрутка и продвижение сайта
Интересное


Красивое горизонтальное меню д...
Рейтинг: 49794


Мини профиль + Форма входа
Рейтинг: 48688


Мини-чат для ucoz
Рейтинг: 44093


Скрипт мониторинга cs серверов
Рейтинг: 39413
Статистика
Онлайн всего: 3
Гостей: 3
Пользователей: 0

Сегодня нас посетили:
bapedHot, zapedHot
Яндекс.Метрика
Главная » Скрипты для ucoz » Скрипты для ucoz

Иконки возле списка для uCoz

Иконки возле списка для uCoz
Скрипты для ucoz - не совсем та категория, куда нужно вносить эту новость, но все же оставлю ее пока здесь. С помощью небольшего примера, вы узнаете как с помощью css, можно поставить разные иконки возле нужной строки того или иного списка. Ведь всегда очень красиво когда иконка у списка, только не увлекайтесь.
Шаг 1 - Установка HTML
Создаем список с классом spisky:
Code
<ul class="spiski">
В нем создаем строки с классом и индификатором. Ссылки на иконки мы укажем в CSS, про это позже:
Code
<li class="ico" id="ico_1"> - Уметь правильно верстать.</li>
В итоге должно получится так:
Code
<ul class="spiski">  
  <li class="ico" id="ico_1"> - Уметь правильно верстать.</li>  
  <li class="ico" id="ico_2"> - Потратить своё время правильно.</li>  
  <li class="ico" id="ico_3"> - Задуматься о безопасности в интернете.</li>  
  <li class="ico" id="ico_4"> - Стать настоящим администратором.</li>  
  <li class="ico" id="ico_5"> - Найти новых пользователей.</li>  
  </ul>
Шаг 1 - Установка CSS
Теперь вставляем в CSS, который находится по пути: П.У - Дизайн - Упр. Дизайном(CSS), следующий код:
Code
.spiski {  
  list-style-type: none;  
  font: 125%/1.5 Verdana,Arial,Helvetica, sans-serif; color:#555;  
  }  

  .ico {  
  margin-top: 5px;  
  padding: 0px 0px 0px 25px;  
  }  
  #ico_1 {  
  background:url('http://wallaby.ucoz.ru/images33/fon_ico_1.png) no-repeat;  
  }  
  #ico_2 {  
  background:url('http://wallaby.ucoz.ru/images33/fon_ico_2.png') no-repeat;  
  }  
  #ico_3 {  
  background:url('http://wallaby.ucoz.ru/images33/fon_ico_3.png') no-repeat;  
  }  
  #ico_4 {  
  background:url('http://wallaby.ucoz.ru/images33/fon_ico_4.png') no-repeat;  
  }  
  #ico_5 {  
  background:url('http://wallaby.ucoz.ru/images33/fon_ico_5.png') no-repeat;  
  }
Дополнительнительные строки
Если хотите больше строк с разными катинками, добавляем в CSS:
Code
#ico_№ {  
  background:url('ССЫЛКА НА КАРТИНКУ') no-repeat;  
  }
- номер иконки.
В HTML после ul class="spiski" и перед /ul:
Code
<li class="ico" id="ico_№"> - ВАША НАДПИСЬ.</li>
- номер картинки что в CSS.

Совет для вебмастеров!.
Внимание, мы настоятельно рекомендуем использовать домены 2-го уровня, такие как ru,com и т.п. стоят они не дорого, ru можно купить за 99 руб, не нужно делать сайт на юкозовском домене! Сайт с юкозовским доменом долеко не уйдет! Если ж у Вас все таки нету жалких 99 рублей, Вы можите зарегистрировать бесплатно домен 2-го уровня tk, по данной ссылке
ЖМИ И РЕГИСТРИРУЙ
С уважением, администрация.
Категория: Скрипты для ucoz | Добавил: Wallaby
Просмотров: 1367
Теги: Иконки возле списка для uCoz - Скрипты для ucoz, новые интересные Скрипты для ucoz - Иконки возле списка для uCoz
Всего комментариев: 0

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
wallaby.ucoz.ru
Поиск
Шаблоны для ucoz
Sape
ремонт ноутбуков ижевск
Лучшая коллекция аниме на анимемувие, валлаби рекомендует!) купить кухню в ульяновске
Скрипты для ucoz
Joomla
Cinema 4D
Графика для uCoz
Copyright wallaby.ucoz.ru - Мировой портал - Joomla,Ucoz,Cinema 4D © 2017 Карта сайта | Карта форума