| Autor | Zpráva | ||
|---|---|---|---|
| pavel456 Profil * |
#1 · Zasláno: 9. 10. 2012, 21:45:48
Dobrý den,
mám následující kód: <div id="mainhl">
<h1>text</h1>a v css toto: #mainhl h1 {
text-align:center;
background:#808080;
color:#FFFFFF;
font-size:200%;a čekal bych, že to pozadí obalí celý text (na výšku) - čili vznikne barevný rámeček a v něm text. Když ale zvětším font-size třeba na 500%, výška pozadí (rámečku) je stále stejná, zvětšila se pouze výška textu. Proč? Děkuji za vysvětlení. |
||
| Trejpa Profil |
#2 · Zasláno: 9. 10. 2012, 22:08:38
pavel456:
„Když ale zvětším font-size třeba na 500%, výška pozadí (rámečku) je stále stejná, zvětšila se pouze výška textu. Proč?“ Uvedený kód se chová tak, jak bys čekal. Zřejmě jsi nadpisu nastavil navíc pevnou výšku (třeba v jiném místě stylů), zvětšený text se do výšky nevleze a přetéká přes okraj elementu, tedy i přes jeho pozadí. |
||
| pavel456 Profil * |
#3 · Zasláno: 9. 10. 2012, 22:27:25
Trejpa:
To je docela dobře možný. Ale jak v tom případě fungujou samotný css styly? proto jsem ten nadpis h1 dal do divu v domnění, že když do css dám #mainhl h1, ovlivním jen h1 v tom divu a ne další h1... čili dá se udělat to, aby třeba každej h1 vypadal jinak? Příp. co mám dopsat do css k #mainhl h1 ? |
||
| Trejpa Profil |
pavel456:
„co mám dopsat do css k #mainhl h1 ?“ #mainhl h1 { height: auto; }„Ale jak v tom případě fungujou samotný css styly?“ 1) Na nadpis se nejdříve aplikují všechna pravidla h1 { … }, 2) potom se na nadpis aplikují pravidla #mainhl h1 { … } (s vyšší prioritou). Prioritu má hlubší zanoření, stejně zanořené vlastnosti upřednostňují poslední zápis. „když do css dám #mainhl h1, ovlivním jen h1 v tom divu a ne další h1...“ Špatná úvaha. Uvedené vlastnosti se sice použijí pro daný nadpis, ale neuvedené se nenastaví do výchozího stavu. Nelze izolovat elementy od jinde nastavených vlastností, můžeš je jen po jedné nastavovat zpět do výchozích hodnot. „čili dá se udělat to, aby třeba každej h1 vypadal jinak?“ Každý musíš odlišit. Buď adresací zanoření, třídou nebo identifikátorem. Třeba: #hlavicka h1 { … }
#obsah h1 { … }„proto jsem ten nadpis h1 dal do divu“ Tak to stačí identifikovat konkrétní nadpis. Zbytečné zanoření. |
||
| pavel456 Profil * |
#5 · Zasláno: 11. 10. 2012, 16:45:38
Trejpa:
> Každý musíš odlišit. Buď adresací zanoření, třídou nebo identifikátorem. Třeba: > > > #hlavicka h1 { … } > #obsah h1 { … } Ať dělám co dělám, furt se mi to nedaří nastavit. Tak přidávám živou ukázku. Jak mám teda odlišit ten h1 v živé ukázce tak, aby h1 na ostatních stránkách (které mam zatím offline) zůstaly nezměněné? http://www.rubikscube.howto.cz/jpw.php |
||
| weroro Profil |
Už keď to je obalené v tom DIVe, tak by som menil background-color priamo tomu divu a nie h1. Nastav tomu divu padding: 0 0;
A zmeň mu identifikátor, respektíve použi radšej class. |
||
| Trejpa Profil |
pavel456:
Dělá ti to line-height nastavená v body ( font: 80%/1.5em Verdana,Tahoma,arial,sans-serif;). Nenastavuj její velikost absolutně všem elementům, v body se velikost odvozuje od základní velikosti písma a tato absolutní hodnota se dědí. Doporučuji použít relativní velikost řádkování vůči velikosti písma (font: 80%/1.5 Verdana,Tahoma,arial,sans-serif;), nebo každou pevnou hodnotu nastavovat až konkrétním elementům.
|
||
| pavel456 Profil * |
#8 · Zasláno: 11. 10. 2012, 17:25:58
Trejpa:
díky moc! |
||
|
Časová prodleva: 12 let
|
|||
0