Autor Zpráva
Majim
Profil *
Rád bych se optal proč při tomto stylu zápisu není nadpis <h1> ve hlavičce červený, ale je žlutý?


#hlavicka, #paticka {background-color: green; color: white}
#hlavicka, #paticka H1 {color: red}
#hlavicka, #paticka H3 {color: yellow}
#hlavicka, #paticka a:link {color: blue}
#hlavicka, #paticka a:visited {color: silver}
#hlavicka, #paticka a:hover {color: red}
#hlavicka, #paticka a:active {color: yellow}

Je to špatný zápis?

Snažil jsem se jen o obdobu kódu :#hlavicka, #patka { background-color: navy; color: yellow; border-style: none; border-width:
medium; }
Kajman_
Profil *
Tipnul bych si, že chyba bude někde v tom, co jste neposlal.

Jestli je to někde vystavené, tak napište adresu, spíš se to najde.
Majim
Profil *
Bohužel zatím to nikde vystavené nemám. Snažím se udělat si nějakou formu do které bych potom předělal to co mám bez sloupců, bez pozic, zkrátka primitivně uděláno.

Prosím nesmějte se mi :-/

Taky se snažím udělat okraje pro text, zkoušel jsem padding a mardin, ale to bych asi musel dát do tabulky a to se mi zdá zbytečně složité, nebo zadávat okraje pro každý <p> zvlášť?

<style>

#obsah {position: absolute; width: 600px; top: 120px; left: 150px}
#paticka { width: 100%; }
#hlavicka {position: absolute; width: 865px; height: 120px; top: 0px; left: 0px}
#levy {position: absolute; width: 150px; top: 120px; height: 100%; left: 0px}
#pravy {position: absolute; width: 110px; top: 120px; height: 100%; left:750px}


#obsah {background-color:rgb(102,217,255); color: black}
#obsah H3 {color: black}
#obsah a:link {color: blue}
#obsah a:visited {color: green}
#obsah a:hover {color: red}
#obsah a:active{color:yellow}

#hlavicka, #paticka {background-color: green; color: white}
#hlavicka, #paticka H1 {color: red}
#hlavicka, #paticka H3 {color: yellow}
#hlavicka, #paticka a:link {color: blue}
#hlavicka, #paticka a:visited {color: silver}
#hlavicka, #paticka a:hover {color: red}
#hlavicka, #paticka a:active {color: yellow}
#levy {background-color: blue; color: silver}
#levy h3 {color: green}
#levy a:link {color: yellow}
#levy a:visited {color: silver}
#levy a:hover {color: red}

#pravy {background-color: blue; color: silver}
#pravy h3 {color: green}
#pravy a:link {color: yellow}
#pravy a:visited {color: silver}
#pravy a:hover {color: red}

</style>

</head>

<body>

<div id="obsah">


OBSAH BEZNY TEXT POZICOVANI!!!!!!!!!!!!!!!!!!!!!!!!!!
POZICOVANI!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!


<p id="paticka">
<p>PATICKA ODKAZY A DOPORUCENI CO DAL POZICOVANI KOPYTO</p>

<a href="MMMMMM.html"title="V PATE">ODKAZ ASI NA NEKAM?!</a>


</div>

<div id="hlavicka">
<p>&nbsp;</p>
<h1>HLAVICKA NADPIS POZICOVANI KOPYTO</h1>
A DALŠÍ PODTEXT NADPISU

</div>

<div id="levy">
<p>&nbsp;</p>
<h3> LEVY MENU POZICOVANI KOPYTO</h3>

ODKAZY

<p> <a href="MMMMMM.html">ODKAZ</a></p>
<p><a href="sezname.html">Členové</a></p>
</div>

<div id="pravy">
<p>&nbsp;</p>
<h3>PRAVY REKLAMA ODKAZY JINAM POZICOVANI KOPYTO</h3>

ODKAZY

<a href="MMMMMM.html"title="BYBYBYBY">ODKAZ ASI NA SEZNAM</a>

</div>
</body>

</html>
Majim
Profil *
Samozřejmě před tím co jsem poslal je <!DOCTYPE> <html> a meta tagy :-)
Dík Majim
Majim
Profil *
..... a <head>........
Plaváček
Profil
No, nadpis je žlutý, protože jsi zapomněl na základní zásadu kaskády, tenhle zápis totiž říká:

#hlavicka, #paticka H1 {color: red}

- pro DIV #hlavicka a pro nadpis H1 v divu #paticka nastav barvu pisma na cervenou

- a tento zápis jako druhý v pořadí změní předchozí definici. V CSS platí, že nastavuješ-li pro stejný element různé hodnoty, použije se poslední definice.

#hlavicka, #paticka H3 {color: yellow}

jinýmí slovy, druhým zápisem definici barvy písma pro DIV #hlavicka změníš z červené na žlutou.

Řešením je dopsat třeba druhý řádek takto:


#hlavicka H1, #paticka H3 {color: yellow}
Majim
Profil *
Děkuji o tom, že to funguje takto jsem neměl tušení do kaskád moc nevidím :-(


Neporadí mi ještě někdo s těmi okraji? Aby text nebyl tak přilepený na všech okrajích?

Nemáte někdo nějakej jednoduchej fígl?

Třeba kam zadat padding, nebo margin, už jsem to zkoušel, ale nedaří se:-(

Variant jsem našel hodně, ale nezdá se mi že by něco odokrajovalo jen text...
Plaváček
Profil
Asi bych začal tady: http://www.semantika.name/zakladni-kostra-stranky.html , s tím, že základem je dobrá struktura stránky. Pak postačí (použiješ-li pro text odstavce P, jak žádá sémantika), pro P nadefinovat padding, neboli výplň. Nějak takto:

p {padding: 15px;}

Třebas
Majim
Profil *
Díky za radu.
Vypadá to , že je to docela oříšek, který je nutno si pohlídat.

Jdu to studovat!
Toto téma je uzamčeno. Odpověď nelze zaslat.

0