Форум Практика оптимизации Любые вопросы от новичков по оптимизации

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

A
На сайте с 24.01.2006
Offline
48
artavaleha
694

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

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

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

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

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

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

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

<tr><b><font color="#000080" size="2" face="Arial">

<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"?>

<p align="left"></td></font></b>

</tr>

</table>

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

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

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

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

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

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

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

<html>

<head>

<title>Untitled Document</title>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<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>

<table width="100%" border="1" cellspacing="0" cellpadding="0">

<tr>

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

</tr>

</table>

</body>

</html>

eTarget 2011:Панельная дискуссия «Стратегия eTarget 2011: Круглый стол Отчет о конференции User
john2007
На сайте с 26.03.2007
Offline
173
john2007
#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
На сайте с 24.01.2006
Offline
48
artavaleha
#3
john2007:
Еще, видимо в <td> нужно прописать class="class2".

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

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

A
На сайте с 24.01.2006
Offline
48
artavaleha
#4

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

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