Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Приоритеты в стеке CSS / 8 сообщений из 8, страница 1 из 1
17.04.2009, 18:22
    #35939522
TJivich
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Приоритеты в стеке CSS
Подскажите, если у меня предположим есть вот такой html

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
<div class="spotlight">
    <div class="header">
    <div class="subcontainers">
         <div class="expand">
              <div class="header">
         </div>
         <div class="expand">
              <div class="header">              
         </div>
    </div>
</div>

и я хочу применить к классу header разные настройки.

Код: plaintext
1.
2.
.expand .header { font:  10  }
.spotlight .header { font:  20  }

но так выходит, что spotlight почему то побеждает expand.

если писать

Код: plaintext
1.
2.
.spotlight .expand .header { font:  10  }
.spotlight .header { font:  20  }

то работает, но это не совсем подходящий вариант.
...
Рейтинг: 0 / 0
17.04.2009, 18:37
    #35939550
akopium
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Приоритеты в стеке CSS
TJivich,

совет почитать о наследовании в CSS
...
Рейтинг: 0 / 0
17.04.2009, 18:50
    #35939581
Ps-spectre
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Приоритеты в стеке CSS
По-нормальному это так надо делать:
Код: plaintext
1.
2.
3.
4.
	<style type="text/css">
		.expand > .header { font-size: 10pt; color: red; }
		.spotlight > .header { font-size: 20pt; color: blue; }
	</style>
Но превед ИЕ6 (а возможно и ИЕ7, нету его под рукой)
ИЕ8 полностью css2.1 поддерживает.
Для нормальных браузеров
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
<html>
<head>
	<title>test</title>
	<style type="text/css">
		.expand > .header { font-size: 10pt; color: red; }
		.spotlight > .header { font-size: 20pt; color: blue; }
	</style>
</head>
<body>
	<div class="spotlight">
		<div class="header">
			header in spotlight
		</div>
		
		<div class="subcontainers">
			 <div class="expand">
				<div class="header">
					header in expand
				</div>
			 </div>
			 <div class="expand">
				<div class="header">              
					header in expand
				</div>
			 </div>
		</div>
</div>
</body>
</html>
...
Рейтинг: 0 / 0
17.04.2009, 18:52
    #35939585
TJivich
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Приоритеты в стеке CSS
Модератор: реклама блога удалена//illion

А при чём тут наследование, по наследованию expand ниже в иерархии чем spotlight, так что срабатывать должен он.
...
Рейтинг: 0 / 0
17.04.2009, 19:01
    #35939617
TJivich
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Приоритеты в стеке CSS
Модератор: реклама блога удалена//illion

В реальной ситуации там ">" не прокатит ((
...
Рейтинг: 0 / 0
17.04.2009, 19:13
    #35939644
Ps-spectre
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Приоритеты в стеке CSS
TJivich
В реальной ситуации там ">" не прокатит ((
Ну опиши реальную ситуацию, комьюнити здесь сильное. Может в твоем случае есть какое-то тривиально решение, без велосипедостроительства. И кто-то подскажет куда копать.
И почему нельзя сделать два класса? header1/header2 например?
или элементу <div id="someDiv" class="someclass1 someclass2" ></div> два класса присваивать, или 3 ))

p.s. ">" это и есть, самое что ни есть "наследование". Жаль, что старый ИЕ, не дружит с этой штучкой, как и с другими ксс2.1 штучками. :(
...
Рейтинг: 0 / 0
17.04.2009, 20:28
    #35939772
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Приоритеты в стеке CSS
Чем проще и яснее в читабельности код - тем лучше.
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
18.04.2009, 00:38
    #35940015
illion
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Приоритеты в стеке CSS
TJivich
А при чём тут наследование, по наследованию expand ниже в иерархии чем spotlight, так что срабатывать должен он.
А при чём тут иерархия, если у Вас .spotlight .header стоит после .expand .header и элементарно перезадает определенный в .expand размер шрифта для .header? Не противоречьте сами себе - поменяйте правила местами.

И что это за новое слово в css - "font: 10"? Ознакомьтесь со спецификацией.
http://w3schools.com/css/css_font.asp
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Приоритеты в стеке CSS / 8 сообщений из 8, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]