Про классы и стили

A

48

artavaleha

29 июня 2007, 09:12

682

Добрый день уважаемые Знатоки. Очень не сложный вопрос для вас. Обыскал все, но не нашел точного и четкого ответа.

В терминах не силен, но постараюсь пояснить на примере.

делаю страничку index.html

На ней есть меню, в котором применен: class onmouseover.

Но в силу того, что я туп в вопросах програмирования, приходиться каждой ячейке в таблице пропмсывать вот этот код:

<table border="0" cellpadding="0" cellspacing="0"

width="100%" height="5%" bgcolor="#DDD9C8">

<td class="SSS"

onmouseover="this.style.backgroundColor='#F0EEE6'"

style="BACKGROUND-COLOR:"#DDD9C8"

onmouseout="this.style.backgroundColor= '#DDD9C8'"

vAlign="top" align="middle" width="178"#A99250

height="18"?>

</tr>

</table>

А ячеек меню у меня более 60 -ти А если каждой ячейке этот код прописывать. страница огромная получается, вернее код страницы.

Вот теперь вопрос. Можно ли как то это в стили прописать, до верхнего <body>там где прописываются все невидимые значения сайта. Напишите поподробнее. А то на одном крутом форуме программерском задал такой вопрос, так там просто написали, используй {td} А как именно не понятно. напишите пример плиз.

Благодарю вас за проявленное внимание и помощь.

Блог о дизайне и рекламе - Изготовим наружную рекламу и широкоформатную печать в Митино - 960 8024 (http://rakurc.ru)

S

18

Solnce

29 июня 2007, 10:49

#1

В этом примере при наведении на ячейку меняется цвет фона ячейки и стиль текста.

В теле тэга <style> для class1 и class2 задаете, соответственно, нужные Вам при наведении и выходе стили.

Но в каждой ячейке все равно надо прописывать: onmouseover="this.className='class1';" onmouseout="this.className='class2';" - код несколько меньше, чем в Вашем примере получится.

<html>

<head>

<title>Untitled Document</title>

<style>

.class2 { color:#000000; font-family:Arial; font-size:9px; background-color:#ffffff;}

.class1 { color:#ffffff; font-family:Arial; font-size:14px; background-color:#ff0000}

</style>

</head>

<body>

<tr>

<td onmouseover="this.className='class1';" onmouseout="this.className='class2';">текст-текст-текст</td>

</tr>

</table>

</body>

</html>

eTarget 2011:Панельная дискуссия «Стратегия eTarget 2011: Круглый стол Отчет о конференции User

173

john2007

29 июня 2007, 11:06

#2

Solnce:

<body>
<table width="100%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td onmouseover="this.className='class1';" onmouseout="this.className='class2';">текст-текст-текст</td>
</tr>
</table>
</body>
</html>

Еще, видимо в <td> нужно прописать class="class2".

Можно, конечно, еще уменьшить HTML код (если ячеек много), прописав onmouseover и onmouseout для требуемых ячеек в цикле на javascript, но это ИМХО какой-то фанатизм по объему страницы :)

Совершая ошибки, мы не только учимся их не повторять, но и учимся прощать такие же ошибки другим... (с)

eTarget 2011:Панельная дискуссия «Стратегия eTarget 2011: Круглый стол Могут ли «плохие» входящие

A

48

artavaleha

29 июня 2007, 13:21

#3

john2007:
Еще, видимо в <td> нужно прописать class="class2".

Можно, конечно, еще уменьшить HTML код (если ячеек много), прописав onmouseover и onmouseout для требуемых ячеек в цикле на javascript, но это ИМХО какой-то фанатизм по объему страницы :)

Спасибо, вы помогли, тока я уже думаю ваще отказаться от этого гемора, дабы облегчить жизнь и себе и поисковым роботам.

A

48

artavaleha

29 июня 2007, 13:22

#4

Спасибо за помощь.

Зачем быть уникальным в мире, где все можно скопировать

Open AI тестирует память для ChatGPT