Integra в рубрику HTML и CSS

Вопрос: Перекрываение глобальных стилей

Помогите разобраться пожалуйста.
Пример, прописываю глобальные свойства для дива, например на таблицу
#content table{
background: #006b28;
}
и после этого хочу создать таблицу с другим бакграундом но в этом же диве, создаю класс для этой таблицы
#content table.news {
background: #ffffff;
}
или просто класс
.news {
background: #ffffff;
}
и присваиваю его потом таблице

текст

но бакграунд не меняется :(
я поставила свойство !important и после этого заработало, но меня такой вариант неустраивает, потому что мне кое-где нужно вставлять в качестве bacground кртинку прямо в самом html, а в данном случае это невозможно, потому что у меня получается так что глобальный стиль перекрывает локальный, вот



а вместо этой картинки отображается фон прописанный в #content table. Как сделать так что бы глобальный стиль перекрывался локальным без !important?

Задайте свой вопрос

Если у вас есть вопрос по разработке или дизайну сайтов, вы можете задать его на Временно.нет и тысячи наших читателей помогут вам найти на него ответ.

Задать свой вопрос

Расскажите друзьям

Ответы на вопрос — 8

Grin
Только вариант с
#content table.news
либо дописать к таблице еще один класс и делать вот так
#content table.news.another-class
я правда немного запутался с глобальными и локальными классами в твоем объяснении...
Integra
да, замудрила что-то...
когда я создаю
#content table.news
то у него все равно бакграунд наследуется от
#content table
и в html файле когда конкретно в ячейку хочу вставить бакграундом картинку (в таблицу с классом news)то ничего неполучаестя, отображаеся просто фон прописанный #content table.news ...
#
Integra
Grin
Попробуй дописать еще один класс для таблицы (мой второй вариант)
Integra
прописала, но ничего не изменилось. все равно наследуется первоначальный фон... :(
вот то что у меня есть.
css
#content table{
text-align:left;
margin-top:5px;
}
#content table tr th{
text-align:center;
padding: 6px;
background-position: left top ;
background-image:url("../img/bg_th.gif");
background-repeat: repeat-x;
background-color: #006b28;
border:#ffffff 2px solid;
color:#ffffff;
}
#content table tr td{
padding:10px 40px 10px 10px;
border:#ffffff 2px solid;
background:#e6e6e6;

}
#content table.news{
width:600px;
/* и вот тут еще нужно как-то укзать что бы background не наследовался, потому чо он будет вставляться в хтмл, а как это сделать не знаю */
}
#content table.news a{
width:100%;
height:100%;
bgcolor:#006f28;
}

html




текст





смысл в том, что вот этот background="img/apteka.jpg" будет выводится програмно, это разные картинки, (по дизайну все это дело еще и с закругленными краями), внизу поверх этой картинки нарисована полоска и на ней текст, я ее сделала ссылкой. Но ничего не работает, потому что глобальный стиль #content table перекрывает все локальные классы, ни один класс неработает, приходится в описании классов ставить !important. А в описанном случае background прописываеся непосредственно в html а там-то такого нету... В общем я уже не знаю как извратится чо бы эо все работало
#
Integra
Integra
а как хтмл код тут вставлять?
#
Integra
Integra
нашла способ, хотя мне кажется что это извращение, но работает. Прям в тдешке стили прописывать
текст
#
Integra
Integra
<td STYLE="width:180px; height: background: url('img/apteka.jpg') no-repeat"><a href="#">текст</a></td>
#
Integra
Grin
Ну инлайн стили сильнее внешних. Странно, конечно, что вот так не работает:
#content table.news td.tdClass { 
background: transparent url(img.gif)  0 0 no-repeat; 
}
Ну и у ячейки класс:
<td class="tdClass">...</td>

Новый ответ

как выглядит какой тег
жирный текст <b>жирный текст</b>
курсивный тект <i>курсивный тект</i>
зачеркнутый текст <s>зачеркнутый текст</s>
подчеркнутый текст <u>подчеркнутый текст</u>
ссылка <a href="адрес">ссылка</a>
function foo() { ... }
<pre><code>function foo() { ... } </code></pre>
разрешенные теги или посмотреть как будет выглядеть
как выглядит какой тег
жирный текст <b>жирный текст</b>
курсивный тект <i>курсивный тект</i>
зачеркнутый текст <s>зачеркнутый текст</s>
подчеркнутый текст <u>подчеркнутый текст</u>
ссылка <a href="адрес">ссылка</a>
function foo() { ... }
<pre><code>function foo() { ... } </code></pre>
разрешенные теги или посмотреть как будет выглядеть

metin2 pvp metin2 pvp serverler pvp serverler