floyde
Originalni poster- 7. travnja 2005
- Monterrey Meksiko
- 27. ožujka 2006
Imam dva diva. Jedan ima fiksnu visinu i želim da drugi ispuni preostali okomiti prostor na prozoru. Ako postavim visinu posljednjeg diva na 100%, učinit će ga istom visinom kao i prozor, ali želim da to bude visina prozora minus visina prvog diva.
Ovo je kod koji koristim:
Šifra: |_+_|
Uključio sam i neke slike koje pokazuju što želim raditi i što sam do sada mogao. Hvala unaprijed
Prilozi
N
NoNameBrand
- 17. studenog 2005
- Halifax, Kanada
- 27. ožujka 2006
Inače, ne mogu smisliti način na koji ćete dobiti ono što želite.
Stevep
- 13. listopada 2004
- UK
- 27. ožujka 2006
Probati:
Neimenovani dokument
do
b
c
d
I
ps Varao sam tako što sam to napravio u DW-u, dodao nešto sadržaja drugom sloju, a zatim se petljao s kodom - DW voli da stvari imaju neke podloge oko rubova i iako u dijaloškim okvirima možete odrediti koji sloj želite početi od 0px od gornjeg kuta, morate to reći dvaput, koristeći prikaz koda. Svejedno sam morao.
floyde
Originalni poster- 7. travnja 2005
- Monterrey Meksiko
- 27. ožujka 2006
NoNameBrand je rekao: Zašto ne ugnijezditi 1. unutar 2.?
Inače, ne mogu smisliti način na koji ćete dobiti ono što želite.
Hvala, to funkcionira vizualno, ali drugi div bit će spremnik za ovaj izgled, tako da mi još uvijek treba da ima odgovarajuće dimenzije kako bi ih njegov sadržaj mogao naslijediti.
Pa možda to jednostavno nije moguće? Možda ću trebati upotrijebiti malo javascripta da bi funkcionirao?
stevep je rekao: Pokušajte:Hvala, ali nisam uspio, koji preglednik ste koristili?
floyde
Originalni poster- 7. travnja 2005
- Monterrey Meksiko
- 27. ožujka 2006
Ok, evo slike mog konačnog cilja. Do sada sam to radio postupno, pa je možda problem moj početni pristup. Dakle, kako biste vi pristupili ovome (samo mi trebaju ideje)? Biste li koristili čisti css ili biste se prepustili tablicama ili okvirima?
Prilozi
Stevep
- 13. listopada 2004
- UK
- 27. ožujka 2006
Ono s kojim se morate poigrati je ovo:
#Layer1 {
pozicija:apsolutna;
lijevo:0px;
vrh:0px;
širina:100%;
visina:180px;
z-indeks: 1;
boja pozadine: #99CCFF;
}
Izravnite svoju stranicu na komad papira kako biste dobili ispravne pozicije, a to će vam dati položaj gornjeg lijevog kuta svakog sloja. Visina sloja 1 će odrediti početnu poziciju sloja 2 - u ovom slučaju sloj 2 mora imati avrh: 180px;redak koda.
Ako želite 3 sloja kao što ste pokazali u svom zadnjem postu, onda će krajnji lijevi sloj biti:
#Layer1 {
pozicija:apsolutna;
lijevo:0px;
vrh:0px;
širina:200px;
visina:100%;
z-indeks: 1;
boja pozadine: #336699;
}
a gornji RH sloj će biti:
#Layer1 {
pozicija:apsolutna;
lijevo:200px;
vrh:0px;
širina:100%;
visina:180px;
z-indeks: 2;
boja pozadine: #33CCFF;
}
a treći sloj za popunjavanje preostalog dijela prozora (kako god mu se promijenila veličina) trebao bi biti nešto poput:
#Layer1 {
pozicija:apsolutna;
lijevo:200px;
vrh: 180px;
širina:100%;
visina:100%;
z-indeks: 3;
boja pozadine: #99CCFF;
}
Najbolje je staviti neki lažni sadržaj u svaki sloj ako koristite Dreamweaver, u slučaju da se sloj smanji na ništa u prikazu stranice, stoga 'a,b,c itd.' u izvornom html-u iznad.
ps nisam stručnjak, možda griješim ali nadam se da će pomoći. Ono što mogu reći je da izgleda da moj prvi dio koda radi. Ja osobno ne bih ugnijezdio slojeve da mogu malo pomoći, ali to sam samo ja - radim samo jednostavno. N
NoNameBrand
- 17. studenog 2005
- Halifax, Kanada
- 27. ožujka 2006
Evo što bih učinio:
Kodirati:
foo vjeruješ!
-
- 14. lipnja 2003
-
-
- MD / VA / DC
- 27. ožujka 2006
Dekoncept ...
Provjerite FlashObject i u preuzimanju se nalazi kod za izradu diva preko cijelog zaslona.. možda se može prilagoditi kako želite.
http://blog.deconcept.com/flashobject/ floyde
Originalni poster -
- 7. travnja 2005
-
-
- Monterrey Meksiko
- 28. ožujka 2006
Hvala za svu pomoć, ali upravo sam shvatio da je točan izgled koji želim nemoguće postići kombinacijom fiksnih širina/visina i postotaka. Prepisao sam ga koristeći samo postotke i sada radi. Ako vas zanima oznaka, javite mi i objavit ću je. Stevep
-
- 13. listopada 2004
-
-
- UK
- 28. ožujka 2006
floyde je rekao: Ako vas zanima oznaka, javite mi i objavit ću je.
Htio bih pogledati ako imate vremena za ponovno objavljivanje.
NoNameBrand je rekao: Što su to 'slojevi' stvari? je li to u stilu Dreamweavera za 'break stvari stvarno dobro'?
Pa, ne znam za 'stvari za razbijanje', ali pretpostavljam da ste pretpostavili da nisam CSS boff - slojevi su prikladan naziv koji je DW dao stvarima za koje mislim da bi se trebale zvati 'CSS pozicionirani elementi' - i Mislim da ih tako zovu da bi se ljudi poput mene iz DTP / Photoshop pozadine osjećali malo ugodnije. Gledajući kod koji ste uključili u svoju objavu NoNameBrand puno je elegantniji od moga - morat ću se potruditi da stvarno shvatim div tag. Hvala na OP-u i odgovorima. N NoNameBrand
-
- 17. studenog 2005
-
-
- Halifax, Kanada
- 28. ožujka 2006
stevep je rekao: Pa, ne znam za 'stvari za razbijanje', ali pretpostavljam da ste pretpostavili da ja nisam CSS boff - slojevi su zgodno ime koje je DW dao stvarima za koje mislim da bi se trebale zvati 'CSS pozicionirani elementi '
Na sebi su također imali z-indekse koji se slažu - koji postavljaju stvari naprijed-nazad na stranicu. Vidio sam slojeve DW-a i prije koji su potpuno uništili stranicu, ali inače im nisam bio previše izložen (to je bilo dovoljno, stvarno).
Morat ću se probati kako bih stvarno shvatio div tag.
A je samo proizvoljan blok - ne znači ništa semantički, kao aradi (odlomak teksta). Aje ista ideja, ali za inline stvari (kao što je a tag, ali opet, bez semantičkog).
Najlakše je naučiti ove stvari prestati koristiti Dreamweaver. Svoje web stranice dizajniram u Photoshopu, a zatim spremam grafičke elemente koje želim, zajedno s bilježenjem kodova boja i nekih grubih mjerenja piksela za potrebe poravnanja, a zatim kodiram stranicu u TextWrangler ili VIM. floyde
Originalni poster -
- 7. travnja 2005
-
-
- Monterrey Meksiko
- 28. ožujka 2006
stevep je rekao: Želio bih pogledati imate li vremena ponovno objaviti.
Evo ga, ima malo španjolskog, nadam se da nije previše zbunjujuće:
Kodirati:Velika shema html { visina: 100%; } tijelo { margina: 0; dopuna: 0; visina: 100%; širina: 100%; } #lijevo, #desno { float: lijevo; } #lijevo { visina:100%; boja pozadine: narančasta; širina: 10%; } #desno { visina: 100%; položaj:relativan; širina: 90%; } #top { background-color: blue; visina: 10%; } #fotos { položaj: relativan; visina: 90%; } #foto_sup_izq, #foto_sup_der, #foto_inf_izq, #foto_inf_der { visina: 50%; širina: 50%; preljev: auto; pozicija: apsolutna; } #foto_sup_izq, #foto_sup_der { top: 0; } #foto_sup_der, #foto_inf_der { lijevo: 50%; } #foto_inf_izq, #foto_inf_der { top: 50%; } 
Prilozi
Popularni Postovi