Нужен результат: меняется фон ячейки таблицы при наведении на нее мыши.
Допустим, переменная $classname может принимать значения current и nocurrent. Менять фон нужно только для nocurrent. Используем такие стили:
.nocurrent {
background: white;
}
.current {
background: red;
}
.nocurrent:hover {
background: red;
}echo "<td class='".$classname."'>some text</td>";
В IE6 такой вариант работать не будет.
Можно так (но для current cтиль тоже будет меняться):
echo "<td class='".$classname."' onmouseover='style.backgroundColor=\"red\";' onmouseout='style.backgroundColor=\"white\";'>some text</td>";
Правильный вариант, ну во всяком случае у меня так получилось :)
function RPClass(hi) {
if (hi.className == 'nocurrent') {
hi.className = 'current_js';
}
}
function RPClassR(hi) {
if (hi.className == 'current_js') {
hi.className = 'nocurrent';
}
}echo "<td class='".$classname."' onmouseover='RPClass(this);' onmouseout='RPClassR(this);'>some text</td>";
CSS (:hover теперь не нужен, стили просто будут меняться, вместо него второй стиль):
.current_js {
background: red;
}
По-умолчанию элементы списка будут располагаться вертикально. В случае, если необходимо разместить их горизонтально, можно использовать седующий способ:
HTML:
<ul class="hor_nav">
<li>Меню 1</li>
<li>Меню 2</li>
<li>Меню 3</li>
</ul>
CSS:
ul.hor_nav {
margin: 0;
padding: 0;
}
ul.hor_nav li {
display: inline;
margin-right: 4px;
padding: 2px;
}Главным в данном примере является то, что к селектору li добавлен стилевой атрибут display со значением inline, который преобразует блочный элемент во встроенный. Также, чтобы убрать отступы вокруг списка, добавлены параметры margin и padding к селектору ul.
Столкнулся с такой проблемой: при вставке кода Youtube, сайт перестал проходить проверку на валидность. Решается так (http://www.youtube.com/v/KhJ-Lh0k1K8&hl=ru_RU&fs=1&color1=0x3a3a3a&color2=0x999999 конечно-же заменить на свое):
Вместо предложенного:
<object width="560" height="340">
<param name="movie" value="http://www.youtube.com/v/KhJ-Lh0k1K8&hl=ru_RU&fs=1&color1=0x3a3a3a&color2=0x999999"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/KhJ-Lh0k1K8&hl=ru_RU&fs=1&color1=0x3a3a3a&color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed>
</object>
пишем:
<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/KhJ-Lh0k1K8&hl=ru_RU&fs=1&color1=0x3a3a3a&color2=0x999999" width="560" height="340">
<param name="movie" value="http://www.youtube.com/v/KhJ-Lh0k1K8&hl=ru_RU&fs=1&color1=0x3a3a3a&color2=0x999999" />
<param name="FlashVars" value="playerMode=embedded" />
</object>
Решение нашел на сайте http://boriskin.ru/kod-youtube-drugix-videosocialok-i-validnyj-valid-xhtml.html
HTML:
<td style="cursor: pointer;" id="logo" onclick="window.location.href='/'"></td>
CSS:
#logo {
background: url(logo.png) no-repeat;
height: 100px;
width: 200px;
}Можно использовать в header сайта, для перехода на главную страницу при нажатии на логотип. Преимущества такого способа заключаются в том, что пропадает возможность при клике правой кпопкой мыши сохранить логотип, как было бы в том случае, если поместить в эту ячейку <a href="/"><img src="logo.png" atl="logo" /></a>
Чтобы сделать отступ в начале каждого абзаца необходимо добавить в доумент:
<style type="text/css">
p {
text-indent: 20px;
}
</style>
В примере рассматривается отображение текста шрифтом Arial оранжевого цвета, курсивом, размером 17pt на белом фоне.
<div style="background: #ffffff; font-family: Arial; font-style: italic; font-size: 17pt; color: #fe572a;">
ваш текст
</div>
