floyde
Cartell original- 7 d'abril de 2005
- Monterrey, Mèxic
- Mar 27, 2006
Tinc dos divs. Un té una alçada fixa i vull que l'altre ompli l'espai vertical restant a la finestra. Si estableixo l'alçada de l'últim div al 100%, la farà la mateixa alçada que la finestra, però vull que sigui l'alçada de la finestra menys l'alçada del primer div.
Aquest és el codi que estic fent servir:
Codi: |_+_|
També he inclòs algunes imatges que mostren què vull fer i què he pogut fer fins ara. Gràcies per endavant
Adjunts
-
xa.gif'file-meta'> 2,6 KB · Visualitzacions: 10.076 -
xb.gif'file-meta'> 3 KB · Visualitzacions: 9.950
NoNameBrand
- 17 de novembre de 2005
- Halifax, Canadà
- Mar 27, 2006
En cas contrari, no puc pensar en una manera d'obtenir el que voleu.
step
- Oct 13, 2004
- UK
- Mar 27, 2006
Prova:
Document sense títol
a
b
c
d
I
ps. He fet trampes fent-ho a DW, afegint contingut a la segona capa i, després, jugant amb el codi: a DW li agrada que les coses tinguin una mica de farciment a les vores i tot i que podeu especificar als diàlegs que voleu una capa. Comenceu a 0px des de la cantonada superior, heu de dir-ho dues vegades, utilitzant la vista de codi. Ho havia de fer de totes maneres.
floyde
Cartell original- 7 d'abril de 2005
- Monterrey, Mèxic
- Mar 27, 2006
NoNameBrand va dir: Per què no niu el 1r dins el 2n?
En cas contrari, no puc pensar en una manera d'obtenir el que voleu.
Gràcies, això funciona visualment, però el segon div serà un contenidor per a aquest disseny, així que encara necessito que tingui les dimensions adequades perquè el seu contingut pugui heretar-los.
Així que potser simplement no és possible? Potser hauré d'utilitzar una mica de javascript perquè funcioni?
stevep va dir: Prova:Gràcies, però no he pogut fer-ho funcionar, quin navegador has utilitzat?
floyde
Cartell original- 7 d'abril de 2005
- Monterrey, Mèxic
- Mar 27, 2006
D'acord, aquí tens una foto del meu objectiu final. Fins ara ho he anat fent gradualment, així que potser el problema és el meu enfocament inicial. Aleshores, com us apropareu a això (només necessito idees)? Faríeu servir css pur o cediríeu a taules o marcs?
Adjunts
step
- Oct 13, 2004
- UK
- Mar 27, 2006
La part amb què has de jugar és aquesta:
#Layer1 {
posició: absoluta;
esquerra: 0px;
superior: 0px;
amplada: 100%;
alçada: 180 px;
índex z: 1;
color de fons: #99CCFF;
}
Despreu la vostra pàgina en un tros de paper per obtenir les posicions correctes i això us donarà la posició de la cantonada superior LH de cada capa. L'alçada de la capa 1 determinarà la posició inicial de la capa 2; en aquest cas, la capa 2 ha de tenir unsuperior: 180 píxels;línia de codi.
Si voleu les 3 capes tal com mostreu a la vostra última publicació, la capa més a l'esquerra serà:
#Layer1 {
posició: absoluta;
esquerra: 0px;
superior: 0px;
amplada: 200 píxels;
alçada: 100%;
índex z: 1;
color de fons: #336699;
}
i la capa superior dreta serà:
#Layer1 {
posició: absoluta;
esquerra: 200px;
superior: 0px;
amplada: 100%;
alçada: 180 px;
índex z: 2;
color de fons: #33CCFF;
}
i la tercera capa per omplir la resta de la finestra (per molt que es canviï la mida) hauria de ser com:
#Layer1 {
posició: absoluta;
esquerra: 200px;
superior: 180 píxels;
amplada: 100%;
alçada: 100%;
índex z: 3;
color de fons: #99CCFF;
}
El millor és posar contingut fictici a cada capa si feu servir Dreamweaver, en cas que la capa no es redueixi a res a la vista de pàgina, d'aquí la 'a, b, c, etc.' a l'html original anterior.
ps no sóc un expert, potser m'equivoco però espero que ajudi. El que puc dir és que el meu primer fragment de codi sembla que funciona. Jo personalment no aniria capes si pogués ajudar una mica, però només sóc jo, només ho faig senzill. N
NoNameBrand
- 17 de novembre de 2005
- Halifax, Canadà
- Mar 27, 2006
Això és el que faria:
Codi:
foo creus!
-
- 14 de juny de 2003
-
-
- MD / VA / DC
- Mar 27, 2006
Deconcepte...
Fes una ullada a FlashObject i a la descàrrega hi ha el codi per fer un div a pantalla completa... potser es pot adaptar com vulguis.
http://blog.deconcept.com/flashobject/ floyde
Cartell original -
- 7 d'abril de 2005
-
-
- Monterrey, Mèxic
- Mar 28, 2006
Gràcies per tota l'ajuda, però m'acabo d'adonar que el disseny exacte que vull és impossible d'aconseguir amb una combinació d'amplada/altura i percentatges fixos. El vaig reescriure utilitzant només percentatges i ara funciona. Si esteu interessats en el marcatge, feu-m'ho saber i el publicaré. step
-
- Oct 13, 2004
-
-
- UK
- Mar 28, 2006
floyde va dir: Si estàs interessat en el marcatge, fes-m'ho saber i el publicaré.
M'agradaria fer una ullada si tens temps per tornar a publicar.
NoNameBrand va dir: Què és això de les 'capes'? Això és Dreamweaver per a 'break stuff real-bon'?
Bé, no sé sobre les 'coses trencadores', però suposo que suposo que no sóc un boff de CSS: les capes són un nom convenient que dóna DW a coses que crec que s'han d'anomenar 'elements posicionats en CSS' - i Crec que els anomenen així per fer que la gent com jo des d'un fons DTP / Photoshop se senti una mica més còmode. Mirant el codi que heu inclòs a la vostra publicació NoNameBrand, és molt més elegant que el meu: hauré de fer un esforç per encertar l'etiqueta div. Gràcies per l'OP i les respostes. N NoNameBrand
-
- 17 de novembre de 2005
-
-
- Halifax, Canadà
- Mar 28, 2006
stevep va dir: Bé, no sé sobre les 'coses trencadores', però suposo que suposo que no sóc un boff de CSS; les capes són un nom convenient que dóna DW a coses que crec que s'han d'anomenar 'elements posicionats en CSS'. '
També tenien índexs z apilats, que col·loquen les coses de davant a darrere en una pàgina. He vist capes de DW abans que trenquessin totalment un lloc, però en cas contrari no hi he tingut gaire exposició (n'hi havia prou, realment).
Hauré de tenir una punyalada per aconseguir realment el meu cap al voltant de l'etiqueta div.
A és només un bloc arbitrari; no vol dir res semànticament, com afa (un paràgraf de text). Aés la mateixa idea, però per a coses en línia (com a etiqueta, però de nou, lliure de semàntica).
El més fàcil de fer per aprendre aquestes coses és deixar d'utilitzar Dreamweaver. Dissenyo els meus llocs a Photoshop i després deso els elements gràfics que vull, juntament amb l'anotació de codis de color i algunes mesures aproximades de píxels amb finalitats d'alineació, i després codifiquem el lloc a TextWrangler o VIM. floyde
Cartell original -
- 7 d'abril de 2005
-
-
- Monterrey, Mèxic
- Mar 28, 2006
stevep va dir: M'agradaria fer una ullada si tens temps per tornar a publicar.
Aquí el teniu, hi ha una mica d'espanyol, espero que no sigui massa confús:
Codi:Grand Scheme html { alçada: 100%; } cos { marge: 0; farciment: 0; alçada: 100%; amplada: 100%; } #esquerra, #dreta { flotant: esquerra; } #esquerra { alçada:100%; color de fons: taronja; amplada: 10%; } #dreta { alçada: 100%; posició: relativa; amplada: 90%; } #top { color de fons: blau; alçada: 10%; } #fotos { posició: relatiu; alçada: 90%; } #foto_sup_izq, #foto_sup_der, #foto_inf_izq, #foto_inf_der { alçada: 50%; amplada: 50%; desbordament: automàtic; posició: absoluta; } #foto_sup_izq, #foto_sup_der { top: 0; } #foto_sup_der, #foto_inf_der { esquerra: 50%; } #foto_inf_izq, #foto_inf_der { superior: 50%; } 
Adjunts
Entrades Populars