Форум Сайтостроение Веб-строительство

Что бы цвета менялись при наведении?

Astaldo
На сайте с 28.01.2006
Offline
174
Astaldo
588

Как вот мне сделать так, что бы цвета у текста и у бг у td менялись местами?

вот у этих чуваков в менюшках это сделано:

http://kitchenbook.educationcentral.com/educationcentral/index.jsp?portal_id=127&domain=kitchenbook.com&keyword=book&referrer=

У них там это без замены рисунков сделано - там вообще без рисунков - это здорово - это мне так и надо...

Только вот как?

:confused:

Live as if you were to die tomorrow. Learn as if you were to live forever. Mahatma Gandhi
Neta
На сайте с 02.03.2004
Offline
51
Neta
#1

Обычно для этого css используют

Astaldo
На сайте с 28.01.2006
Offline
174
Astaldo
#2

Ну да.


.topNavLink A {
PADDING-RIGHT: 3px; DISPLAY: block; PADDING-LEFT: 3px; BACKGROUND: #3d140c; PADDING-BOTTOM: 3px; COLOR: #fff; PADDING-TOP: 3px; TEXT-DECORATION: none
}
.topNavLink A:hover {
BACKGROUND: #fff; COLOR: #3d140c; TEXT-DECORATION: none
}

такое?

dkameleon
На сайте с 09.12.2005
Offline
386
dkameleon
#3

Правый клик. Вью Сорс.

Находим подключенный ЦСС:

body {font-family:verdana,arial,sans-serif;font-size:11px;font-weight:normal;color:#333;background:#fff;line-height:16px;padding-top:20px;}
a {color:#3d140c;}
a:hover {color:#333;}
#main {width:800px;border:1px solid #000;}
#topNav {font-family:arial,sans-serif;font-weight:bold;font-size:11px;text-transform:uppercase;letter-spacing:1px;background:#3d140c;}
.topNavUnit {font-weight:normal;width:1px;background:#fff;}
.topNavLink {text-align:center;}
.topNavLink a {color:#fff;text-decoration:none;display:block;padding:3px;background:#3d140c;}
.topNavLink a:hover {color:#3d140c;text-decoration:none;background:#fff;}

Нажодим кусок менюхи:

<table cellspacing="0" cellpadding="0" border="0" align="center" id="main">

<tr>
	<!-- topnav -->
	<td id="topNav">
	<table cellspacing="0" cellpadding="0" border="0" style="width:100%">
	<tr>

		<td class="topNavLink"><a href="results.jsp?portal_id=127&domain=kitchenbook.com&survey=lander&keyword=eBOOK" target="_top">eBOOK</a></td>

		<td class="topNavUnit"><img src="images/blank.gif" width="1" height="1" border="0" /></td>

		<td class="topNavLink"><a href="results.jsp?portal_id=127&domain=kitchenbook.com&survey=lander&keyword=Buy+Book+Online" target="_top">Buy Book Online</a></td>


		<td class="topNavUnit"><img src="images/blank.gif" width="1" height="1" border="0" /></td>

		<td class="topNavLink"><a href="results.jsp?portal_id=127&domain=kitchenbook.com&survey=lander&keyword=Book+Used" target="_top">Book Used</a></td>

		<td class="topNavUnit"><img src="images/blank.gif" width="1" height="1" border="0" /></td>

		<td class="topNavLink"><a href="results.jsp?portal_id=127&domain=kitchenbook.com&survey=lander&keyword=Textbook" target="_top">Textbook</a></td>

		<td class="topNavUnit"><img src="images/blank.gif" width="1" height="1" border="0" /></td>

		<td class="topNavLink"><a href="results.jsp?portal_id=127&domain=kitchenbook.com&survey=lander&keyword=Art+Book" target="_top">Art Book</a></td>

		<td class="topNavUnit"><img src="images/blank.gif" width="1" height="1" border="0" /></td>


		<td class="topNavLink"><a href="results.jsp?portal_id=127&domain=kitchenbook.com&survey=lander&keyword=Christian+Book" target="_top">Christian Book</a></td>

		<td class="topNavUnit"><img src="images/blank.gif" width="1" height="1" border="0" /></td>
		<td class="topNavLink"><a href="article.jsp?domain=kitchenbook.com&portal_id=127" target="_top">Education Articles</a></td>

	</tr>
	</table>

	</td>
	<!-- end topnav -->

</tr>
</table>

Не забываем доктайп:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Дизайн интерьера (http://balabukha.com/)
ronald
На сайте с 17.11.2005
Offline
154
ronald
#4

Astaldo, можно проще:

вставляешь в td, где ссылка пункта меню -

onmouseover="this.style.backgroundColor='#цвет при наезде мыши'" onmouseout="this.style.backgroundColor='#цвет при ненаезде'"

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий