Нужна помощь по CSS.
Страницы: 1
Нужна помощь по CSS.
Добрый день. Нужна помощь по оформлению ссылок в меню. Как сделать с помощью CSS что бы текст ссылки в меню при наведении курсора плавно увеличивался на пару пикселей и принимал чорный цвет. С ув.
Посмотрите:

css-style.su/sintecsis2.5.php

Полная плавность и пр - через jquery:

jquerylist.ru/menu/jquery-flash-like-menu.html
.1 {
font-size: 14px;
color:c0c0c0;
}

a:hover .1 {
font-size: 16px;
color:000;
}

плавность можно реализовать только с помощью JS скриптов. Выше вам что-то кинули.
Изменено: Алик Яушев - 9 Мая 2013 16:19
Не подписываюсь на темы, так что не слежу за вопросами, которые вы оставляете в топике после меня. Если нужно получить ответ, пишите в ЛС с указанием ссылки на мой комментарий.
Свойство CSS отвечающее за плавность - transition.
Пример
ul li a{
transition: all 0.5 ease-out;
}
ul li a:hover{
height:20px;
ну или что вы там хотите менять
}
Изменено: Александр - 9 Мая 2013 17:09
Цитата
Александр пишет:
Свойство CSS отвечающее за плавность - transition
Не все так просто с CSS3 - вопросы кроссбраузерности (префиксы -webkit-, -moz- и -o-, плюс IE версии).
Изменено: Coder - 9 Мая 2013 17:29
1. Поставьте префиксы, кто мешает, а для ie пропишите js костыли .
2. Скрипты тоже могут не сработать, если пользователь их отключил. 
3. Человек спросил: "Как сделать с помощью CSS?". Я ответил.
Цитата
Александр пишет:
Человек спросил: "Как сделать с помощью CSS?". Я ответил.
Я просто дополнил информацию для TC.
Изменено: Coder - 9 Мая 2013 18:07
Народ я вообще половины даже не понял, наверное нужно что то ещё подучить. Скрипты PHP у меня работают. Если не сложно, можите подробно обяснить что к чему. Я выкладываю код своего CSS.
Сильно не ругайте.

body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 90%;
    font-weight: norm;
    background: #FFF;
    }


h1 {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:16px;
    font-weight:bold;
    margin:0;
    padding:0;
    }



ul {
    list-style: none;
    margin: 0;
    padding: 0;
    }

img {
    border: none;
    }
   
.menu {
    width: 200px;
    margin: 10px;
    }
   
.menu li a {
    height: 32px;
      voice-family: "\"}\"";
      voice-family: inherit;
      height: 24px;
    text-decoration: none;
    }   
   

   
.menu li a:link, .menu li a:visited {
    color: #333;
    display: block;
    background:  url(menu.gif);
    padding: 8px 0 0 10px;
    }
.menu li a:hover {
    color: #FFF;
    background:  url(menu.gif) 0 -32px;
    padding: 8px 0 0 10px;
    }
Цитата
Я просто дополнил информацию для TC.
Спасибо!

Цитата
 
.menu li a {
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
height: 24px;
text-decoration: none;
 } 
.menu li a:link, .menu li a:visited {
color: #333;
display: block;
background: url(menu.gif);
padding: 8px 0 0 10px;
}
.menu li a:hover {
color: #FFF;
background: url(menu.gif) 0 -32px;
padding: 8px 0 0 10px;
  }
Что-то я вас не понимаю. Что значит -  height: 32px; и   height: 24px; в одном правиле.  По теме: 
.menu li a {
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
padding: 8px 0 0 10px;
text-decoration: none;
font-size:14px; /*к примеру*/
transition: all 0.3 ease-out;
-webkit-transition: all 0.3 ease-out; /*Chrome, Safari*/
-moz-transition: all 0.3 ease-out; /*FF*/
-o-transition: all 0.3 ease-out; /*Opera*/
line-height:32px;
 } 
.menu li a:hover {
font-size:16px;
color: #FFF;
background: url(menu.gif) 0 -32px;
  }
Пробуйте.
Спасибо за содействие Александр. Я попробоваал, ничего не работает. С CSS кодом плная неразбериха, оказывается он состоит из двух частей, почему так не помню я когдато шаблон скачал из интернета, так всё и работает. Я вам Александр скину в личку название сайта и CSS код, а вы посмотрите если не трудно.
a{
    font-size:14px;    
    -webkit-transition: font-size 300ms ease-in-out;
    -moz-transition: font-size 300ms ease-in-out;
    -o-transition: font-size 300ms ease-in-out;
    transition: font-size 300ms ease-in-out;
    -webkit-transition: color 300ms ease-in-out;
    -moz-transition: color 300ms ease-in-out;
    -o-transition: color 300ms ease-in-out;
    transition: color 300ms ease-in-out;
}
a:hover{
    color:black;
    font-size:16px;
}

вместо a подставьте нужные классы (Пишутся через точку, например .class)
Помогите сделать фон, сейчас картинка вверху, остальное заполняет цвет, нужно - картинка чтоб осталась также вверху, а вместо цвета чтоб заполняла пространство другая картинка, она, естественно будет стыковаться с верхней, вот код который сейчас:
body.bp {
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-color: #7f3f3f;
  background-image: url(../images/fon.jpg);
}
Страницы: 1
Похожие темы:
Читают тему (гостей: 1, пользователей: 0, из них скрытых: 0)
Новые темыОбъявленияСвободное общение
16:36 Переводчик "Яндекса" признан лучшим в мире по качеству 
15:31 Adtrafico - Правильная партнёрская сеть под бурж трафик 
15:28 2Index - быстрая индексация страниц сайта и обратных ссылок 
14:33 XEvil - софт для разгадывания капчи. Бесплатная демо-версия. Привязка к SEO/SMM-софту. 
10:43 Сайт не реагирует на изменения в CSS 
21:12 Доля пользователей Telegram достигла почти половины населения России 
20:24 Telegram введет монетизацию для владельцев каналов 
16:41 ezotraff.ru - Купим ваш эзотерический трафик 
16:04 Продам базу данных предприятий Украины, России, Великобритании, Германии, Испании, Италии, Нидерландов, Польши, Франции, Швейцарии и др. 
14:31 Куплю сайты любой направленности 
13:34 Мобильные и Резидентные Прокси Для Соц Сетей | 3 Гб Бесплатно 
12:42 USMobileSMSBot - 
11:31 Высококачественные и надежные прокси-серверы и 5G 
10:02 TETChange-Обменник криптовалют 
09:38 37 противникам прививок от COVID грозят уголовные дела 
09:34 Курс доллара упал ниже 85 рублей 
21:10 С юмором по жизни! 
21:08 Ням-ням! - 8 деликатесов, которые когда-то ели только бедные люди 
20:21 Linux - это максимальная свобода 
16:04 Workle.ru - это развод и мошенничество! 
13:33 ФАС сделала замечания "Яндекс Такси" из-за цен