Sign In
Create Account
[CSS & HTML]Cum să modific dimensiuile unui <div> in mod dinamic?
Last Updated: Apr 28 2015 17:38, Started by
TorchMan
, Apr 25 2015 17:39
·
0
0
#1
Posted 25 April 2015 - 17:39
|
Salut,
Am niște niste elemente de bază, cu ajutorul cărora vreau să construiesc o "ramă" și aceasta ar trebui să conțină elemente HTML. Cam așa ceva : [ http://s13.postimg.org/61w6gcjvr/foto.png - Pentru incarcare in pagina (embed) Click aici ] Cum ar trebui să procedez ca acea ramă să își modifice dimensiunile în funcție de conținut. (Dacă mai adaug un buton sub cel de "Login" , dimenisiunile ramei să crească pe axa-y) Din câte am citit, mă pot folosi de tagul <div> ca să "țin alte elemente la un loc".Am găsit o soluție care nu e chiar potrivită pentru scenariul meu. HTML: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> <link rel="stylesheet", href="Resurse/CSS/style.css"> </head> <body> <h1>Inceput</h1> <div id="a1"> <div id="a2"> </div> <div id="a3"> </div> <div id="a4"> </div> </div> <h1>Sfarsit</h1> </body> </html> CSS:
#a1{
background-image:url(../Images/ThinBoard/thinboard_corner_lefttop.png),url(../Images/ThinBoard/thinboard_corner_leftbottom.png),
url(../Images/ThinBoard/thinboard_corner_rightbottom.png),url(../Images/ThinBoard/thinboard_corner_righttop.png);
background-position:top left,bottom left,bottom right,top right;
background-repeat:no-repeat,no-repeat,no-repeat,no-repeat;
position:relative;
width:900px;
height:1200px;
}
#a2
{
background-image:url(../Images/ThinBoard/thinboard_line_left.png),url(../Images/ThinBoard/thinboard_line_right.png);
position:absolute;
top:16px;
background-position:top left,top right;
background-repeat: repeat-y,repeat-y;
width:900px;
height:1168px;
}
#a3
{
background-image:url(../Images/ThinBoard/thinboard_line_top.png),url(../Images/ThinBoard/thinboard_line_bottom.png);
position:absolute;
left:16px;
background-position:top left,bottom left;
background-repeat: repeat-x,repeat-x;
width:868px;
height:1200px;
}
#a4{
background-image:url(../Images/ThinBoard/base.png);
position:absolute;
left:16px;
top:16px;
background-repeat:repeat;
width:868px;
height:1168px;
}
Metoda mea nu e ok pentru că rama nu își schimbă dimensiunile "dinamic". Cum ar arăta o rezolvare mai elegantă? Și ar mai fi o nelămurire. În cazul în care rama e destul de mare, deci și numărul de pătrățele e ridicat, ar putea îngreuna încărcarea paginii? |
Back to top
#2
Posted 28 April 2015 - 17:38
|
Lucreaza cu dimensiuni (width/height) procentuale si/sau min-*, max-*
|
Anunturi
Bun venit pe Forumul Softpedia!
▶ 0 user(s) are reading this topic
0 members, 0 guests, 0 anonymous users
-
- Change Theme
- English
- Mark Community Read
- Termene & conditii
- Confidentialitate
- Consimtamant
- Cookies
- Help
© 2001-2024 Softpedia. All rights reserved. Softpedia® and the Softpedia logo are registered trademarks of SoftNews Net SRL.
Ora implicita a Forumului Softpedia este ora standard a Romaniei (GMT+2). Mai multe informatii →
⚠ Postarile afisate pe Forumul Softpedia reprezinta o opinie subiectiva a membrilor care le-au publicat si nu a SoftNews Net SRL.