Реклама на hackersoft.ru Реклама на hackersoft.ru

Вернуться   Форумы Hackersoft > Околотематические разделы > Веб-мастеру
CHAT Регистрация Справка Пользователи Доска почета Календарь Поиск Сообщения за день Все разделы прочитаны

Веб-мастеру Общение разработчиков и содержателей веб-сайтов

Ответ
 
Опции темы
Старый 30.12.2010, 17:22   #1
deimands
adherent 
 
Аватар для deimands
 
Регистрация: 27.01.2010
Прописка: 192.168.0.2
Сообщений: 108
Вес репутации: 3 deimands пользователь
Депозит: 0$
Вы сказали Спасибо: 41
Поблагодарили 12 раз(а) в 8 сообщениях
Хочу написать такой код на html
Допустим нарисовал я кнопку повесил на сайт, нарисовал 2-ю и хочу чтоб при наведении на 1-ю кнопку менялся рисунок на 2-ю.
Например как тут http://ruseller.com/ вверху красная строка меню, как наводишь мышкой на какой-то пункт меню и оно меняет картинку.

息の通間息を量。
http://img246.imageshack.us/img246/4701/archk.jpg

Последний раз редактировалось deimands, 30.12.2010 в 17:46.
deimands вне форума   Ответить с цитированием
Старый 30.12.2010, 17:46   #2
Kanaris
Администратор 
 
Аватар для Kanaris
 
Регистрация: 24.07.2007
Прописка: Везде, где есть воздух
Сообщений: 1,639
Вес репутации: 76 Kanaris экспертKanaris экспертKanaris экспертKanaris экспертKanaris экспертKanaris экспертKanaris экспертKanaris экспертKanaris экспертKanaris экспертKanaris эксперт
Депозит: 0$
Вы сказали Спасибо: 238
Поблагодарили 1,121 раз(а) в 424 сообщениях
Код HTML:
<style type="text/css">
a.menu{background: url(http://адрес обычной картинки на ссылке)}
a.menu:hover{background: url(http://адрес картинки при наведении)}
</style>
<a class="menu" href="http://lol.com">Dfgdfg</a>

Оффтоп
Kanaris вне форума   Ответить с цитированием
Благодарности Kanaris от:
Старый 02.01.2011, 04:43   #3
deimands
adherent 
 
Аватар для deimands
 
Регистрация: 27.01.2010
Прописка: 192.168.0.2
Сообщений: 108
Вес репутации: 3 deimands пользователь
Депозит: 0$
Вы сказали Спасибо: 41
Поблагодарили 12 раз(а) в 8 сообщениях
Кто понимает в веб дизайне, нужна помощь.
Вот у мну есть 2 блока на дивах, 1-н картинка 2-й текст
Как мне сделать чтоб картинка была справа, а не слева как по стандарту. И текст был слева неё, пробовал в стиле картинки прописать float но чет не помогло.

<div id="1">
<img src="chphoto_001.gif" width=222 >
</div>



<div>
Knight of Swords, Servant of the Saber.
Beautiful girl with golden hair and deep green eyes transparent.
But in a delicate petite look, the best class, it boasts superior combat power by Takashi Isamu suitable for Saber.
Respect the instructions of his master, 物Wakari is good, because too serious, there is some rigid.
</div>

мой css

#1 {
margin: 5px 5px 5px 0px;
width: 100px;


могу выложить полностью весь код хтмл страницы и весь css
Оффтоп
Оффтоп
код конечно полный фейсролл)

息の通間息を量。
http://img246.imageshack.us/img246/4701/archk.jpg
deimands вне форума   Ответить с цитированием
Старый 02.01.2011, 10:32   #4
SoftHack
☣ 
 
Аватар для SoftHack
 
Регистрация: 07.07.2009
Прописка: Real Life
Сообщений: 610
Вес репутации: 16 SoftHack продвинутыйSoftHack продвинутыйSoftHack продвинутыйSoftHack продвинутый
Депозит: 0$
Вы сказали Спасибо: 290
Поблагодарили 262 раз(а) в 176 сообщениях
Мда...
Ошибок куча, поэтому не работает =\
  • Теги нужно закрывать
  • Имена селекторов в css должны соответствовать именам в html
  • Не нужно для каждой картинки создавать отдельный div
  • Имя class или id не должно начинаться с цифры
html
Код HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style.css" type="text/css" rel="stylesheet">
<title></title>

<body>
<div id="container">
  <div id="header"> </div>
  <div id="content">
    <div id="left1">
      <div class=separator></div>
      <div id="href1"> <a href="index.html" > Home </a> </div>
      <div id="href1"> <a href="1"> News </a> </div>
      <div id="href1"> <a href="index2.html"> Character </a> </div>
      <div id="href1"> <a href="index3.html"> Story </a> </div>
      <div id="href1"> <a href="2"> Gallery </a> </div>
      <div id="href1"> <a href="index4.html"> Contacts </a> </div>
      </div>
    <div id="content_text"> Knight of Swords, Servant of the Saber.
      Beautiful girl with golden hair and deep green eyes transparent.
      But in a delicate petite look, the best class, it boasts superior combat power by Takashi Isamu suitable for Saber.
      Respect the instructions of his master, ?Wakari is good, because too serious, there is some rigid.
      </div>
      <div id="content_img">
      <img src="123.gif"/>
      
     </div>
    </div>
    <div id="clear"> </div>
    <div id="footer"> FOOTER</div>
  </div>
</div>
</body>
</html>

css
#container {
width:780px;
height:100%;
margin-left:123px;
margin:0 auto;
}

#clear {
height:0;
font-size:1px;
line-height:0px;
clear:both;
}

#footer {
background-color:gray;
}

#header_text {
font-weight: bold;
font-size: 20px;
text-align:center;
}


a:link {
color: white;
text-decoration:none;
font-weight:bold;
}
a:visited {
color:white;
}
a:hover {
color:red ;
text-decoration:none;
font-weight:bold;
}
a:active {
color:black;
text-decoration:none;
text-transform:uppercase;
}



div.separator {
clear: both;
font-size: 1px;
height: 60px;
line-height: 10px;
-webkit-transition:background-color 0.18s linear, border-color 0.18s linear;
}


#href1 {
background-color: #1E1E21;
margin: 4px;
text-align: center;


}
#href1:hover {
background-color: gray;

}

#content_img {
margin: 7px 0px 5px 0px;

}

#content_text {
float:left;
width: 480px;
}

#content_img {
float:left;
width:300px;
height:45px;

}

#Homeim1 {
margin:0 auto;
width:300px;
height:45px;


}

#text1{

}


в коде вариант с 2-мя div'ами, но можно сделать по другому: картинка со свойством align:right

PS советую использовать html и css валидаторы.

HackersOfTrue! Хакеры правды! (C) Kanaris

Последний раз редактировалось SoftHack, 02.01.2011 в 17:40. Причина: +1 существенная ошибка
SoftHack вне форума   Ответить с цитированием
Благодарности: 2
Ответ


Здесь присутствуют: 1 (пользователей: 0 , гостей: 1)
 
Опции темы

Ваши права в разделе
Вы не можете создавать темы
Вы не можете отвечать на сообщения
Вы не можете прикреплять файлы
Вы не можете редактировать сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.


Часовой пояс GMT +4, время: 23:21.


© 2005 — +∞ Hackersoft. Все и вся защищены.
Публичная оферта | Правила форума | Реклама на сайте
Powered by vBulletin®©™ Jelsoft®©™ Enterprises Ltd. Перевод: zCarot.
Реклама на hackersoft.ru Реклама на hackersoft.ru