Autor Zpráva
midas
Profil *
Ahoj, chtěl bych zvýraznit slovo zdarma. Prostě bych si chtěl definovat styly a zapsal bych je do divu "obsah" . Že by tag div "obsah" obsahoval třeba div zvyrazneni. Zkoušel jsem to, ale nějak mi to nefungovalo. Nebo by to šlo udělat úplně jinak?

Tady je index.html:
<html>
<head>
<title>Windows Mobile</title>
<link rel="stylesheet" type="text/css" href="styly.css">
</head>

<div id="obsah">bla bla bla  ZDARMA</div>


a tady je css:
#obsah {position: absolute; width: 1113px; top: 120px; left: 150px; 

height: 800px}
#obsah {background-image: url("pozadi.jpg"); color: black; color: 660033}
#obsah a:link {color: B07E9B}
#obsah a:visited {color: B07E9B}
#obsah a:hover {color: #00CC33}


Dík za odpovědi

Moderátor Davex: Zvýrazněn výpis CSS.
Nox
Profil
Jasně....proč si to nezkusil? Věděl bys hned....jen je tu detail že div je blokový, takže lepší by bylo použít span, což je to samý, akorát jako výchozí je řádkový

A ještě lepší by bylo použít něco sémantičtějšího a víc odpovídajícího - co třeba strong/b ?
WanTo
Profil
Zvýraznit to můžeš bez problémů přes em nebo strong (jde nastylovat). A to absolutní pozicování není dobrý, fakt ne.
midas
Profil *
Jo, já měl u style 1 tečku místo křížku. A s tím spanem výborný nápad- už se mi to nezalamuje. Díky za trpělivost, není to sranda, psát stránky, jsem zjistil :-)

Mějte se a asi sem nepíšu naposledy.
midas
Profil *
Jo a k tomu absolutnímu pozicování: Pročpak to není dobrý?
panther
Profil
midas:
Pročpak to není dobrý?
- stránku nevycentruješ nikdy, což je asi tvým záměrem
- 1113px šířky je dost, měl bys myslet na rozlišení od 1024px

Celkově je (absolutní) pozicování dobrá věc, jen se mu ze začátku vyhýbej, dokud nebudeš vědět, jak s ním pracovat.


Ještě k původnímu dotazu. Divy se běžně skládají do sebe. Když se něco centruje, centruje se zpravidla obalový div, který obsahuje další (header, content, footer, ...)
midas
Profil *
A teda kdybych to udělal relativní, tak se to každému navštěvníkovi roztáhne podle jeho monitoru?
Já jsem si myslel, že je relativní pozicování těžší..
Davex
Profil
Nepoužívej absolutní ani relativní pozicování - místo nich použij obtékání.
panther
Profil
midas:
A teda kdybych to udělal relativní, tak se to každému navštěvníkovi roztáhne podle jeho monitoru?
ne.

Já jsem si myslel, že je relativní pozicování těžší..
není těžší nebo lehčí. Jen se hodí každé na něco jiného.

O centrování se zde píše mnoho, hledej.
midas
Profil *
A kdybych stránke tedy upravil pomocí toho obtékání textu, bude to mít každý návštěvník s rozličnými monitory vyplněné přes celou obrazovku?
panther
Profil
midas:
neptej se a zkus přemýšlet.

Šířka lze v CSS zadat, projdi si možné hodnoty, třeba tě napadne, která bude ta pravá.
midas
Profil *
Díky moc, omlouvám se, jestli jsem vás rozčílil svými začátečnickými dotazy
panther
Profil
midas:
omlouvat se nemusíš. Samozřejmě bych ti mohl napsat, že hodnota bude taková a maková, ale když na to přijdeš sám, utkví ti to snáze v paměti. A bude tě to těšit.
Miloš
Profil
midas:
Celou stránku obal jedním divem (třeba <div id="cela_stranka">), kterému nastav rozměry buď úplně natvrdo (pak je rozumných nějakých 980px – s ohledem na lidi s rozlišením 1024×768), nebo použij omezeně pružnou šířku (nepřežeň to, měj ohled na to, aby se text dobře četl – proto je dobré hodnotu zadávat v jednotkách em) pomocí vlastnosti max-width (pozor na to, že ji IE6 neumí a vyšší IE v quirku taky ne, ale tomu se zase dá odpomoci podmíněnými komentáři) a div vycentrovat okraji s hodnotou auto.

Menu, pokud je v kódu před obsahem stránky, můžeš pomocí float-left strčit k levému okraji. Nezapomeň na „čističe“. A přečti si, jak funguje obtékání: http://www.pixy.cz/pixylophone/2003_12_archiv.html#1071056082
Můžeš ho taky absolutně napozicovat v kontextu nadřazeného divu, ale musíš moc dobře vědět, co děláš. Chceš-li to zkusit, pořádně si prostuduj zdánlivě nesouvisející článek http://wellstyled.com/css-chords-formatting.html
panther
Profil
Miloš:
kterému nastav rozměry buď úplně natvrdo [...] nebo použij omezeně pružnou šířku
nevím, jestli tam nebude třeba jiné hodnoty, když [#10]: „bude to mít každý návštěvník s rozličnými monitory vyplněné přes celou obrazovku?“. Osobně jsem to pochopil na „width: 100%“, ale možná se mýlím. Proto jsem to více nerozepisoval, na 100% se dá přijít relativně snadno.

Přiznám se, že jsem se v tom přání midase trochu ztratil. Podle [#1] a pozicování to vypadalo na centrování, teď zase ne. Kdo ví, jak to celé má být...
Miloš
Profil
panther:
nevím, jestli je žádoucí mít stránku přes celou obrazovku – při mých 2048 by to většinou asi vypadalo dost zběsile.
Asi jsem neodpovídal přímo podle zadání, ale snažil jsem se midase popostrčit správným směrem.
midas
Profil *
Diky za odpovedi, Milosi, mam ted do Vanoc co cist :-) Jinak to, ze se v mych pranich ztracite, to se vam ani nedivim. ted tedy jen tak pro uplnost resim to, aby nekdo, kdo ma mensi rozliseni, aby nemusel rolovat. zatim jsem precetl veci o obtekani, ci float. je to moc pekna vec. Ale jakej je vlastne rozdil optoti absolutne pozicovanymu? Omlouvam se za chybejici diakritiku, pisu z PDA.
Miloš
Profil
midas:
Absolutně pozicovaný prvek je „vyjmut z toku dokumentu“, což znamená, že se okolní prvky chovají, jako by tam nebyl.
—— Prvek je vykreslen na místě, které je zadáno souřadnicemi top a left (vzdálenost od horního a levého kraje), nebo bottom a right (vzdálenost od spodního a pravého kraje); lze kombinovat (top a right, nebo bottom a left).
—— Pokud některou souřadnici vynecháš, nabyde hodnoty dosavadního umístění. Pozor ale na vlastnost margin a chování všech IE v quirku a IE6 kdykoli.
—— Souřadnice, od kterých se počítají hodnoty top (bottom) a left (right), jsou určeny nejbližším nadřazeným pozicovaným prvkem, tedy prvkem s position:absolute nebo position:relative, a to zcela nezávisle na tom, je-li pak tento nadřazený prvek někam posouván. Proto můžeš často potkat bloky, které mají zdánlivě zbytečně position:relative, ačkoli s nimi není nikam pohybováno. Jak už jsem výše psal, je to skvěle popsáno v http://wellstyled.com/css-chords-formatting.html

Obtékáný prvek je také „vyjmut z toku dokumentu“, neboli taktéž se okolní prvky chovají, ale toto chování platí jen pro prvky blokové (odstavce, nadpisy, divy), zatímco řádkové prvky (tj. text a obrázky) takového „plaváčka“ obtékají (což se samozřejmě nevztahuje na ty prvky, které v CSS přetypujeme na display:block a naopak).
—— Obtékaný prvek je automaticky přetypován na display:block, takže nemá cenu ho přetypovávat na něco jiného (s výjimkou řešení dvojitého marginu, ale ani tam v zásadě nejde o přetypování).
—— Obtékaný prvek je posunut ke kraji nejbližšího nadřazeného bloku.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: