Vise HTML strana kako CSS podesiti ?

[Serbianboss]

Znaci imam nekoliko html strana, recimo: pocetna.html, o nama.html, kontakt.html.

Ja napravim CSS fajl i nazovem ga recimo pocetna.css. I taj css je glavni layout za sve tri html strane (pocetna.html, o nama.html, kontakt.html). Medjutim stranice: o nama.html i kontakt.html treba da imaju izmenjene neke css elemente za sidebar i foother... Kako to da napravim, kako je najpravilnije.

Znaci na svakoj stranici je pocetna.css jer je to glavni layout, ali svaka stranica mora da ima neku izmenu u css-u.
Mislio sam da za stranice o nama.html i kontakt.html napravim nove css fajlove: onama.css i kontakt.css i da u njih importujem pocetna.css na sledeci nacin: @import url ("pocetna.css"); i onda bi posebno u css fajlovima onama.css i kontakt.css vrsio izmene u css kodu samo za te stranice.

Primer onama.css:

onama.css
@import url ("pocetna.css");

#sidebar {width: 400px;} // u glavnom css fajlu(pocetna.css) sidebar je bio 500px ali u stranici onama.html ne odgovara da bude 500px nego 400px. Da li je ovaj nacin ispravan. Ovako bi ovde mogao da menjam i za foother i za contect ako postoji potreba.

Zanima me da li je ovo ispravan nacin ili ne. Ovo je sad primer za 3 html strane, da li se na isti nacin moze iskoristiti i ako imam recimo 20 html stranica ?

 

[sysninja]

A možeš i u samom html fajlu (u tvom slučaju onama.html) da definišeš taj određeni deo cssa koji menjaš pod <style type="text/css"> tagom.

 

[abc011abc]

koristi klase...

u HTML dodaj class="ime_klase", a u CSS definiši te klase, npr:

p {
text-align: justify;
}
p.ime_klase {
font-weight: bold;
}

vidi npr. ovde:
http://www.tizag.com/cssT/class.php

 

[sirNemanjapro]

Dovoljno je da dodas novu klasu. Jer kada browser cita CSS i na primer imas 2 iste klase on ce ovu drugu procitati, a prvu zanemariti. Tako da je dovoljno da dodas jos 2 css fajla za te dve druge strane, za svaku po jedan, i u njima napravis izmene koje hoces.

Naravno ukljucis i pocetna.css sa njima.

btw
Ispravan nacin ne postoji. 🙂 Tj. ne mozes da pogresis. Mozes da napises kako zelis i kako je tebi lakse.
A sa stanovista da li je to lepo... Ja bih rekao da ne treba tako, da je lepse to popakovati u posebne css fajlove.

 

[Serbianboss]

Kakva je situacija da za svaku html stranu imam externi css fajl

Recimo imam pocetna.html, onama.html, kontakt.html itd... I da za sve te strane napravim externe css fajove u kojima ce biti izmene (pocetna.css, onama.css, kontakt.css) i naravno glavnilayout.css. U tom glavnom layoutu bi se nalazila struktura za sve strane, a u ostalim css fajlovima bi se nalazile izmene za te posebne strane.

Mozda bi na taj nacin imao vise externih css fajlova, ali bi na taj nacin svaka strana imala svoji externi css fajl + jedan zajednicki za sve(struktura sajta)

 

[Crni]

Kakva je situacija da za svaku html stranu imam externi css fajl

Recimo imam pocetna.html, onama.html, kontakt.html itd... I da za sve te strane napravim externe css fajove u kojima ce biti izmene (pocetna.css, onama.css, kontakt.css) i naravno glavnilayout.css. U tom glavnom layoutu bi se nalazila struktura za sve strane, a u ostalim css fajlovima bi se nalazile izmene za te posebne strane.

Mozda bi na taj nacin imao vise externih css fajlova, ali bi na taj nacin svaka strana imala svoji externi css fajl + jedan zajednicki za sve(struktura sajta)

Ako iscepkas na mnogo sitnih fajlova usporices ucitavanje 😉
Ako nema puno tih klasa bolje ih sve stavi u jedan fajl jer vreme koje se gubi na svaki file request je vece nego vreme koliko ce se duze citavati taj jedan fajl, a na stranu sto ce biti kesiran. Uostalom, testiraj u Firebug-u koliko ce ti biti duze ucitavanje u obe varijante.

 

[wiz011]

Ja ne znam ni da li eksterni fajl ima smisla ako je za svaku stranu poseban CSS. Ideja eksternog CSS-a je baš to da on bude zajednički za više strana, ako je CSS poseban za svaku stranu ne vidim zašto se ne bi stavio u sam HEAD sa <style></style>

 

[Serbianboss]

Svaka strana recimo ima jedan css fajl koji se zove globalni.css. I u tom fajlu se nalazi layout za sve strane. Ali nigde na webu ne mogu strane da budu iste. Postoji strana galerija.html gde imamo slike, zatim strana o nama.html, itd itd. Znaci svaka strana ima neku izmenu u svom stilu bila manja ili veca izmena. Zato sam i mislio da postoji externi css za svaku stranu(normalno ako uopste postoji potreba za nekom izmenom). Jer recimo sidebar na jednom strani moze biti 400px a na strani galerija moze biti 300px i imati drugu boju. Zato sam i mislio da postoje ti lokalni(externi) css fajlove. Jer na taj nacin bi se isto odvajao sadrzaj od stilova.

E sad, vi kazete da postoji jedan css fajl za sve strane. Mozete li dati neki primer za to. Mozda bi na taj nacin nastala konfuzija od mnogo stilova? Recimo da na index strani imamo <h1> plave boje i 1em a na about strani imamo opet <h1> ali sada crne boje i 2em. Kako bi to izgledalo u jednom css fajlu (znaci da se ne pravi ovog puta css za svaku html stranu).

 

[wiz011]

Pazi ovako... CSS i jeste cascading zato što svaki svaka style instrukcija koja dolazi posle ima prioritet u odnosu na one pre. Prema tome, nema nikakve prepreke da ti u zajednički CSS staviš sve elemente zajedničkog layouta, a da onda u samom HTML fajlu promeniš style za konkretan sidebar, ili da staviš dodatni eksterni CSS za te promene.

Veoma je teško reći šta je najpametnija strategija jer to zavisi od konkretnog slučaja. Ja ponavljam da ne vidim neku prednost eksternog CSS-a koji važi samo za jednu stranu.

A to da strane ne mogu da budu iste... Pa u principu na webu strane jesu iste u tom smislu da se specifikuju stilovi za jednu grupu strana. Znači, ti imaš stilove za najopštiji layout, pa stilove za galeriju, stilove za vesti... Jedinstven eksterni CSS uopšte ne znači da sve strane moraju biti iste. ko ti brani da u CSS staviš nešto tipa p.galerija, p.vesti, p.o_nama...

Možeš da staviš h1.plavi , h1.crni itd. ili samo .plavi, .crni a onda u html-u <h1 class="plavi"> itd. Mislim da ćeš ipak morati malo da pregledaš neke priručnike za CSS, čini mi se da osnovni koncept CSS-a ti nisi shvatio, niti savladao osnovne elemente. Bez toga će teško ići. Sve što sam ti ja rekao drugi su već rekli pre mene, ali ti očigledno nisi ukapirao šta su ti rekli.

Uzgred budi rečeno, primere sam tako sročio da bi bilo jasno na šta mislim, u praksi nije dobro klasama davati imena tipa plavi, crni... jer se može desiti da naslov koji je sada plav kasnije odlučimo da promenimo u crven, a ostaje nam naziv klase "plavi", koji stvara posle konfuziju.

 

[Serbianboss]

Jasan je meni princip kaskadnih stilova, nego sam hteo da vidim da li sam neke stvari u vezi klasa razumeo. Takodje cilj mi je da sve stilove za sve strane pisem u jednom css fajlu, kako ne bi mozda dolazilo do opterecenja servera zbog mnogo fajlova.

Recimo ako hocemo da sve stilove za sve strane imamo u jednom css fajlu, to moze i ovako da se uradi (ako ne gresim).

Svakoj stranici, tacnije <body> zadamo klasu: <body class="prva"> u kome prva oznacava prvu stranu. Za druge strane cemo imati "druga" "treca", itd...

i onda ako na nekoj strani hocemo da promenimo neko pravilo recimo da sidebar ima 400px umesto 300px, bilo bi u css kodu: .druga #sidebar {width:400px}


Recimo ako je heading na prvoj strani h1 {color:red;} i ako hocemo na h1 tag na drugoj strani bude neke druge boje plave i italic onda po meni imamo dva nacina:

1. Nacin je da preko klase koje smo dodelili body tagu: .druga h1 {color:blue; font-style: italic;}

2. Nacin je da napravimo klasu bez koriscenja body taga: h1.nekaklasa {color:blue; font-style: italic;}

Sta mislite o ovom nacinu rada. Znaci ovo je kada postoji jedan css fajl za sve strane.

 

[sT4Lj|n]

ne morash da se tako zezash

Preko klase menjaj sidebarove a za glavne elemente koristi id

lupam ocesh side-bar koji na svakoj stranici ima drugachiju dimenziju npr na pochetnoj 400x500 a na drugoj 400x700

html deo za stranicu pocetna

<body>
<div id="sidebar" class="sidebar_za_stranicu_pocetna"><img src="sidebar_slika.jpg"/>
</div>
</body>

html za stanicu o nama:

<body>
<div id="sidebar" class="sidebar_za_stranicu_o_nama"><img src="sidebar_slika.jpg"/>
</div>

ovo je za css koji vazi za obe stranice i preko koga je najlakshe da kontrolishesh

#sidebar {
}

.sidebar_za_stranicu_pocetna {
width: 400px;
height: 500px;
}

.sidebar_za_stranicu_o_nama {
width: 400px;
height: 700px;
}

Uvek koristi jedan css fajl, a vishe ukoliko je to bash bash bash neophodno.

PS: bem ti ove symbian nokije, se rulz 😛

 

[wiz011]

Da, da, drug Džugašvili dobro kaže, nego meni se činilo da ti i CLASS pravi konfuziju pa nisam hteo još i ID da ubacujem.

 

[Serbianboss]

Sta mislite o dodavanju klase na <body> tagu za svaku stranu.(primer iznad)

 

[Serbianboss]

ne morash da se tako zezash

Preko klase menjaj sidebarove a za glavne elemente koristi id

lupam ocesh side-bar koji na svakoj stranici ima drugachiju dimenziju npr na pochetnoj 400x500 a na drugoj 400x700

html deo za stranicu pocetna

<body>
<div id="sidebar" class="sidebar_za_stranicu_pocetna"><img src="sidebar_slika.jpg"/>
</div>
</body>

html za stanicu o nama:

<body>
<div id="sidebar" class="sidebar_za_stranicu_o_nama"><img src="sidebar_slika.jpg"/>
</div>

ovo je za css koji vazi za obe stranice i preko koga je najlakshe da kontrolishesh

#sidebar {
}

.sidebar_za_stranicu_pocetna {
width: 400px;
height: 500px;
}

.sidebar_za_stranicu_o_nama {
width: 400px;
height: 700px;
}

Uvek koristi jedan css fajl, a vishe ukoliko je to bash bash bash neophodno.

PS: bem ti ove symbian nokije, se rulz 😛

Dva pitanja za ovaj primer.

Znaci ako se na svakoj stranici menja sidebar, svaki put bi trebalo dodati novu klasu na ovaj nacin. Posto smo u ovom primeru dodali id="sidebar" da li onda ne treba da za njega dodajemo neke parametre ako cemo na svakoj stranici da menjemo sidebar?

Drugo:

Ako bi sidebar na svakoj strani bio isti, onda bi definisli samo #sidebar, bez pravljenja bilo kakve klase.