Нужна помощь по 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)
Новые темыОбъявленияСвободное общение
17:27 DreamCash.tl - заработок на онлайн-видео. До 95% отчислений, отличный конверт! 
14:20 Партнерская программа OWNR WALLET 
11:17 Новая поисковая система от OpenAI 
08:07 Самозанятые смогут зарабатывать в рекламной сети VK 
07:57 А ты жарил? АПдейт Яндекс выдача 11 мая 2024 
21:30 Артемий Лебедев: «ВКонтакте» станет «новым поисковиком» 
17:45 Google рассматривает возможность взимания платы за поиск 
15:04 Ручное размещение вечных статей и ссылок на хороших площадках. Опыт 15 лет! 
14:57 Expa24.com Обмен Криптовалют. Ввод/Вывод наличные Украина/Северный Кипр/Мир 
11:46 DualCoin - быстрый криптовалютный обменник 
08:29 TETChange-Обменник криптовалют 
10:09 Coin Click.cc - Быстрый и надежный обмен электронных валют в два клика 
18:40 Раскрутка сайта прогонами и поведенческими. Опыт с 2009 года - качественно на любой бюджет (NEW 2022 новостной прогон)! 
08:15 - Вечные ссылки с трастовых сайтов 2024 проверен FastTrust 
11:40 Кто сделает прогон для адалт сайта? 
09:25 Добро пожаловать в цифровой мир... 
11:16 Ням-ням! - 8 деликатесов, которые когда-то ели только бедные люди 
10:31 Видимо, похороны СУПРа уже прошли как-то по-тихому 
08:08 С юмором по жизни! 
08:02 Жизнь за границей, куда переехать. 
07:58 Точные прогнозы на футбол