Форум программистов Контакты:
О проблемах с регистрацией, почтой и по другим вопросам пишите сюда - post@programmersforum.ru
По необходимости будем регистрировать вручную. И проверяйте папку спам!
Главная  |  Правила форума  |  Исходники Delphi  |  Основы Delphi  |  Блог программистов  |  Рассылка  |  Повторная активизация e-mail  | 

Вернуться   Форум программистов > Web программирование > HTML и CSS

Ответ
 
Опции темы
Старый 31.07.2010, 10:17   #1
Krasi
Форумчанин
 
Регистрация: 12.02.2010
Сообщений: 394
Репутация: 10
По умолчанию Смена цвета

Два прямоугольника в виде меню, один под другим. Это же две вкладки-ссылки, на обоих есть текст. Пользователь наводит мышь на любой прямоугольник, и в этот момент меняется как цвет самого этого прямоугольника, так и цвет текста в нем. Как это проще сделать на css? (Уводит мышь - цвет становится прежним)
__________________
Сайти
Krasi вне форума   Ответить с цитированием
Старый 31.07.2010, 11:44   #2
MrJenika
Форумчанин
 
Аватар для MrJenika
 
Регистрация: 06.09.2009
Сообщений: 361
Репутация: 53
По умолчанию

A:hover Определяет стиль для ссылки при наведении на нее мышью.
То есть берёшь 2 прямоугольника (например при помощи списка)
Прописываешь каждому стиль ссылки то есть фон, цвет текста
потом этому же классу стиль
.my_class a:hover {
фон - уже другойцвет ;
цвет текста - тоже уже отличный от предыдущего
}
__________________
webinmd.com
MrJenika вне форума   Ответить с цитированием
Старый 02.08.2010, 08:46   #3
Krasi
Форумчанин
 
Регистрация: 12.02.2010
Сообщений: 394
Репутация: 10
По умолчанию

Вот так не хочет:
Код HTML:
<div id=menue style="position:absolute; top:-400; left:60%; z-index: 2;">
<table border="0" bordercolor="black" cellspacing="0" cellpadding="14" width="140" id="onhref1"><tr>
<td  class="link1">
<a onmouseover="window.status='Ссылка 1' ;return true" HREF="./mes.php" class="link1">Входящие</a></td></tr>
<tr><td class="link1">
<a onmouseover="window.status='Ссылка 2' ;return true" HREF="./mes.php?out=1" class="link1">Исходящие</a></td></tr>
</table>
</div>
Код:

#onhref1 {
font-size: 15px;
}
#onhref1 .link1 {color: gray;}
#onhref1 .link1:hover {color: #nogray;}
#onhref1 a.link1 {color: white;}
#onhref1 a.link1:hover {color: #bef574;}

Понятно, почему, но как доработать, хз.
__________________
Сайти

Последний раз редактировалось Krasi; 02.08.2010 в 08:56.
Krasi вне форума   Ответить с цитированием
Старый 03.08.2010, 08:53   #4
Magneto
Форумчанин
 
Аватар для Magneto
 
Регистрация: 10.02.2008
Адрес: Magneto Town
Сообщений: 178
Репутация: 29
По умолчанию

html:
Код:

<!doctype html>
<html><head>
	<title>Смена цвета</title>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
			<link rel="stylesheet" type="text/css" href="style.css" />
</head><body>
	<table>
		<tr>
			<td>
				<a href="#">Входящие</a>
			</td>
		</tr>
		<tr>
			<td>
				<a href="#">Исходящие</a>
			</td>
		</tr>
	</table>
</body></html>

css:
Код:

@charset "utf-8";

*{
	margin:0;
	padding:0}

td{
	width:200px;
	height:50px;
	text-align:center}

td a{
	height:100%;
	display:block;
	border:1px solid #333;
	font:24px/50px arial;
	color:#fff;
	text-decoration:none;
	background:#ccc}

td a:hover{
	color:#9f9;
	background:#999}

Скачать документ

Посмотреть как выглядит
Magneto вне форума   Ответить с цитированием
Старый 06.08.2010, 20:38   #5
Cone
Форумчанин
 
Регистрация: 05.08.2010
Сообщений: 127
Репутация: 18
По умолчанию

Можно проще
<td OnMOuseOver="this.style.background= 'silver';this.style.color='green';" OnMOuseOut="this.style.background=' ПРЕЖНИЙ';this.style.color='ПРЕЖНИЙ' ;" ></td>

В место ПРЕЖНИИ прописываешь тот цвет который изначально был!
Cone вне форума   Ответить с цитированием
Старый 07.08.2010, 13:07   #6
Magneto
Форумчанин
 
Аватар для Magneto
 
Регистрация: 10.02.2008
Адрес: Magneto Town
Сообщений: 178
Репутация: 29
По умолчанию

Cone - это ветка HTML и CSS


P.S. обработчиков OnMOuseOver и OnMOuseOut в JavaScript не существует

Последний раз редактировалось Magneto; 07.08.2010 в 14:27.
Magneto вне форума   Ответить с цитированием
Старый 07.08.2010, 16:02   #7
Cone
Форумчанин
 
Регистрация: 05.08.2010
Сообщений: 127
Репутация: 18
По умолчанию

Цитата:
Сообщение от Magneto Посмотреть сообщение
Cone - это ветка HTML и CSS


P.S. обработчиков OnMOuseOver и OnMOuseOut в JavaScript не существует
НУ ВОТ ТАК ТОГДА

<style>


#MCH{
width:200;
height:30;
border;1 solid red;
background-color:silver;
text-align:center;
text-decoration:none;
}


#MCH A:HOVER {
color:white;
background-color:black;
width:200;
height:30;
text-decoration:none;
}


a:link{
color:yellow;
text-decoration:none;
}


a:active{
color:yellow;
text-decoration:none;
}

a:hover(
color:white;
text-decoration:none;
}

a:visited(
color:yellow;
text-decoration:none;
}


</style>
<body>


<div id=MCH><div><a href=#> hi the world </a></div></div>


</body>

Последний раз редактировалось Cone; 07.08.2010 в 16:16.
Cone вне форума   Ответить с цитированием
Старый 10.08.2010, 18:00   #8
Krasi
Форумчанин
 
Регистрация: 12.02.2010
Сообщений: 394
Репутация: 10
По умолчанию

Я придумал попроще:
Код:

#menka {
list-style: none;
border-right:1px solid #999;
padding:0px 0px;
width:150px;
}
#menka a  {
display:block;

background: gray;
height:40px;
text-indent:20px;
font-family: Arial;
font-size: 17px
}

#menka a.link1 {color: white;}
#menka a.link1:hover {background: white;color: gray;}
#menka a.link2 {color: white;}
#menka a.link2:hover {background: white; color: gray;}

+
Код:

<ul id="menka">
<li><a HREF="./mes.php" class='link1'>Входящие</a></li>
<li><a HREF="./mes.php?out=1" class='link2'>Исходящие</a></li>
</ul>

Хотя это почти тоже самое. Но задавать свойства тегов мне не удобно.
__________________
Сайти

Последний раз редактировалось Krasi; 10.08.2010 в 18:04.
Krasi вне форума   Ответить с цитированием
Ответ


Опции темы

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

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

Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Смена цвета формы Rin Общие вопросы Delphi 2 07.12.2009 23:15
Смена цвета. Stranger333 Общие вопросы Delphi 6 07.10.2009 20:14
Смена цвета в ListCtrl assasin Общие вопросы C/C++ 0 22.08.2009 00:13
смена цвета строки dbgrid - ? Evgenii БД в Delphi 3 04.07.2009 06:57
смена цвета ячейки если... zetrix Microsoft Office Excel 0 30.10.2006 19:06




08:07.


Powered by vBulletin® Version 3.8.8 Beta 2
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.

Forex с Admiral Markets — это надежно


Работа на Forex с 2000 года. Очное и дистанционное обучение. Выгодные условия.
магазин горящих туров


более 1000 горящих предложений ежедневно
Бэбиблог - соц сеть для будущих мам


RusProfile.ru


Справочник российских юридических лиц и организаций.