HTML- rad sa postocima-nekoliko pitanja

Bok svima

Evo radim jedan fuš i odlučio sam radit stranicu u postocima i em-ovima. Imam nekoliko pitanja

  1. Kad radim layout od headera zadam width = 100% i height = 13.7% i na stranici se vidi width 100% al height je onolik koliki mi je font slova i tako svi djelovi layouta. Jednostavo height ne reagira. Imam rezoluciju ekrana 1280*1024 i ja sam si zado da mi je header 140 px i pretvorio to u postotke. Ja sam si kao 100% zadao visinu rezolucije 1024px i forlmulom dobio:

         140px/1024px*100= 13.7 %
    

E sad jel nešto krivo radim, jel se gleda rezolucija ekrana za određivanje kaj je 100%
ili nešto drugo?

  1. Imam sliku u headeru. odredio sam da slika bude width = 10% (nekužim od čega?) i height = 10% . Opet ja po onom svom 10% od 1280px je 128px i 10% od 1024px je 102px i ja napravim dimenizje slike u photoshpu 128px*102px al kad ubacim sliku (div za sliku) slika je veča od diva i to mi zadaje probleme jer kasnije desno ide logo. To se vidi samo u dreamweaveru, u browseru ne. Jel mi može neko objasnik kako se to radi sa slikama kada se radi u postocima

Puno Hvala, pozdrav

[quote=“Vordas”]Bok svima

Evo radim jedan fuš i odlučio sam radit stranicu u postocima i em-ovima. Imam nekoliko pitanja

  1. Kad radim layout od headera zadam width = 100% i height = 13.7% i na stranici se vidi width 100% al height je onolik koliki mi je font slova i tako svi djelovi layouta. Jednostavo height ne reagira. Imam rezoluciju ekrana 1280*1024 i ja sam si zado da mi je header 140 px i pretvorio to u postotke. Ja sam si kao 100% zadao visinu rezolucije 1024px i forlmulom dobio:

         140px/1024px*100= 13.7 %
    

E sad jel nešto krivo radim, jel se gleda rezolucija ekrana za određivanje kaj je 100%
ili nešto drugo?

  1. Imam sliku u headeru. odredio sam da slika bude width = 10% (nekužim od čega?) i height = 10% . Opet ja po onom svom 10% od 1280px je 128px i 10% od 1024px je 102px i ja napravim dimenizje slike u photoshpu 128px*102px al kad ubacim sliku (div za sliku) slika je veča od diva i to mi zadaje probleme jer kasnije desno ide logo. To se vidi samo u dreamweaveru, u browseru ne. Jel mi može neko objasnik kako se to radi sa slikama kada se radi u postocima

Puno Hvala, pozdrav[/quote]

Isto kao što se radi s em-ovima. Uzima se referentni font-size.

primjer:

[HTML]
/* uklanjanje margina i paddinga kako bi se stranica svagdje isto ponašala */
*, html { margin: 0; padding: 0; }

/* zadaješ font za html element, odnosno stranicu
moguće su u različitim browserima različite veličine, a mi to ne volimo*/
html { font-size: 16px; }

/*određuješ osnovni font size za body element i sve elemente unutar body taga */

body {
font-size: 62.5%; /* ovo je 10px jer je 62.5% od 16px = 10px */
}

/* nakon toga želiš header visine npr. 100 px, s obzirom da ti je font size: 10px onda ti je header visine 10em; jer 1em sad je jednak 10px, da nisi postavio font-size od body elementa na 62.5% onda bi ti za header visina trebala biti (100px/16px = 6.25em) u slučaju da u headeru postavljaš font-veličine 13px, odnosno 130% ili 1.3em onda bi ti header element trebao imati visinu od 100px/13px = 7.692em itd. itd. itd.*/

#header { height: 6.25em }

[/HTML]

Em veličine su močna stvar, ali ih nije baš lako razumijeti.

Moraš znati da se veličine elemenata i fontova nasljeđiju i prema njima računaju. Uvijek se uzima da je referentna veličina fonz-size ona koja je definirana za prvi element iznad onog elementa za koji se traži dimenzija(ugniježđenog elementa)

Nadam se da ti je bar malo jasnije.

Preporučam ti da stranicu ne radiš po visini u postocima, samo u širinu, a visinu u pixelima određuj. Isto tako slike i postoci to ti neće ići.

Ok radit ću širinu u postocima a visinu u emovima. Al kad mi je slika u divu koji je definiran u postocima i emovima a slika u pikselima kad otvorim operu i otvorim bookmarks koji se otvara (bar kod mene) po širini i kad ga otvorim dijelovi layouta se smanje jer su u postocima al slika koja je u divu ne. I kako poslje slike imam logo a poslje loga ime stranice (napravljeno u photosjopu), naći opet slika, izgubi mi se dio stranice na desnoj strani jer ju je pogurao bookmarks.

Kako to riješit i kako ti radiš kad radiš sa postocima i slikama ?

Hvala, pozdrav

[quote=“Vordas”]Ok radit ću širinu u postocima a visinu u emovima. Al kad mi je slika u divu koji je definiran u postocima i emovima a slika u pikselima kad otvorim operu i otvorim bookmarks koji se otvara (bar kod mene) po širini i kad ga otvorim dijelovi layouta se smanje jer su u postocima al slika koja je u divu ne. I kako poslje slike imam logo a poslje loga ime stranice (napravljeno u photosjopu), naći opet slika, izgubi mi se dio stranice na desnoj strani jer ju je pogurao bookmarks.

Kako to riješit i kako ti radiš kad radiš sa postocima i slikama ?

Hvala, pozdrav[/quote]

Definiraj i sliku u emovima, a ne u pixelima, važno ti je da se držiš jedne mjerne jedinice, a ne da ih mješaš kao što si ti sad pomješao tri komada, ako radiš s emovima sve radi s emovima, ako radiš s % radi sve s %, a ako pak radiš s pixelima radi sve s pixelima nemoj mješati stvari, kao što ne mješaš programske jezike u jednoj stranici nemoj mješati ni mjerne jedinice na jednoj stranici, a za kraj još jednom napomena da ti se prilikom korištenja em mjerne jedinice sve oslanja na font-size.


Copyright © 2020 WM Forum - AboutContact - Sponsored by: Mydataknox & Webmaster.Ninja