Понедельник, 07.07.2025, 04:32
Меню сайта
    Форма входа
    Категории раздела
    скрипты для ucoz сайта [3099]
    шаблоны для ucoz скачать [2660]
    Иконки групп для форума [25]
    Графика для сайта [1953]
    шаблоны psd для фотошопа [27]
    кисти для фотошопа [39]
    уроки фотошопа на русском языке [4]
    стили для фотошопа [3]
    шрифты для фотошопа cs4 [12]
    Web-master [3058]
    Поиск
    Календарь
    Архив записей
    Наш опрос
    Умеете ли вы писать скрипты для ucoz?
    Результаты | Архив опросов
    Всего ответов: 73
    Мини-чат
    200
    Друзья сайта
  • Официальный блог
  • Сообщество uCoz
  • FAQ по системе
  • Инструкции для uCoz
    • Статистика
    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0
    		 Главная » 2009 » Июнь » 1 » Красивое меню в ucoz
    22:36
    Красивое меню в ucoz

    CSS
    Code
    img{border: 0pt;}  

    #vista_toolbar {  
    float:left;  
    font:normal 12px 'Trebuchet MS','Arial';  
    margin:0;  
    padding:0;  
    }  
    #vista_toolbar ul {  
    background-image:url(back.gif);  
    background-repeat:repeat-x;  
    float:left;  
    line-height:32px;  
    list-style:none;  
    margin:0;  
    padding:0 10px 0 10px;  
    width:500px;  
    }  
    #vista_toolbar li {  
    display:inline;  
    padding:0;  
    }  
    #vista_toolbar a {  
    color:#FFF;  
    float:left;  
    padding:0 3px 0 3px;  
    text-decoration:none;  
    }  
    #vista_toolbar a span {  
    display:block;  
    float:none;  
    padding:0 10px 0 7px;  
    }  
    #vista_toolbar a span img {  
    border:none;  
    margin:8px 4px 0 0;  
    }  
    #vista_toolbar a:hover{  
    background: url(left.png) no-repeat left center;  
    }  
    #vista_toolbar a:hover span {  
    background:url(right.png) no-repeat right center;  
    }  
    #vista_toolbar a.right {  
    float:right;  
    }

    HTML
    Code
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">  
    <head>  
    <title>Vista toolbar с помощью CSS</title>  
    <link href="style.css" media="all" rel="stylesheet" type="text/css" />  
    </head>  
    <body>  
    <div>  
    <h1>Vista toolbar с помощью CSS</h1>  
    </div>  
    <div id="vista_toolbar">  
    <ul>  
    <li><a href="#"><span><img align="left" src="add.gif" alt="Добавить" />Добавить</span></a></li>  
    <li><a href="#"><span><img align="left" src="mail.gif" alt="Почта" />Почта</span></a></li>  
    <li><a href="#"><span><img align="left" src="chart.gif" alt="Статистика" />Статистика</span></a></li>  
    <li><a href="#"><span><img align="left" src="mona.gif" alt="Фотогалерея" />Фотогалерея</span></a></li>  
    <li><a class="right" href="#"><span><img align="left" src="sos.gif" alt="Помощь" />Помощь</span></a></li>  
    </ul>  
    </div>  
    </body>  
    </html>
    Категория: скрипты для ucoz сайта | Просмотров: 1261 | Добавил: JakeSully | Рейтинг: 0.0/0
    Всего комментариев: 10
    10 duffy  
    -1
    Да отстой и ВСЕ angry dry

    9 nikit13  
    0
    было!

    6 11d  
    0
    Вот и посмотри что будет
    http://i042.radikal.ru/0906/d1/2aa18003b62b.jpg

    biggrin biggrin biggrin biggrin biggrin biggrin biggrin


    7 JakeSully  
    0
    Если так то сори!
    Ну такой скрипт нашол,и загрузил! tongue biggrin biggrin happy

    8 qCaRTp  
    0
    Харе воровать другие скрипты не написаны тобой!!!! angry angry angry

    3 11d  
    0
    И еще, а где нам взять ( back.gif; right.png) и другие картинки?

    4 JakeSully  
    0
    Ты не умничай!!
    Установи и посмотри как будет!
    Умничает он мне сдесь!

    5 11d  
    0
    Я и без установки вижу что будет angry
    Там простейший html код biggrin

    2 11d  
    0
    Это не только для uCoz!!!
    Я могу таки штук 40 выложить, только есть ли смысл

    ты хотябы вот так отрезал html код

    <div id="vista_toolbar">
    <ul>
    <li><a href="#"><span><img align="left" src="add.gif" alt="Добавить" />Добавить</span></a></li>
    <li><a href="#"><span><img align="left" src="mail.gif" alt="Почта" />Почта</span></a></li>
    <li><a href="#"><span><img align="left" src="chart.gif" alt="Статистика" />Статистика</span></a></li>
    <li><a href="#"><span><img align="left" src="mona.gif" alt="Фотогалерея" />Фотогалерея</span></a></li>
    <li><a class="right" href="#"><span><img align="left" src="sos.gif" alt="Помощь" />Помощь</span></a></li>
    </ul>
    </div>

    А то новички не поймут что надо, а что нет


    1 oMegGasI  
    0
    было!

    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]