Per la realizzazione di un layout fluido, come devo impostare il codice html e soprattutto css per farsì che l'immagine si adatti alla risoluzione? Mi potete indicare qualche tutorial?
Io avevo impostato il codice html
<div id="header">
<div id="header_sx">
<img src="pic/img.jpg" alt="Nonna Iuccia" width="100%" height="200px" />
</div>
<div id="header_dx">
<div class="imageSlideshowHolder" id="imageSlideshowHolder">
<img src="pic/img01.jpg" width="100%" height="300px" />
<img src="pic/img02.jpg" width="100%" height="300px" />
</div>
<script type="text/javascript">
initImageGallery('imageSlideshowHolder');
</script>
</div>
<div>
con il codice css
/*header*/
#header {width:100%; background-color:#9a4233; height:350px; display:block;}
#header_sx {float:left; margin-left:3%; margin-top:5%; border:1px solid red;}
#header_dx {float:right; border:1px solid red; margin-right:3%;}
ma con una diversa risoluzione l'immagine rimane con le stesse dimensioni ed ottengo una disposizione diversa delle immagini.
Ho letto che si può impostare l'immagine di sfondo direttamente nel css, il problema è per le due immagini (img01 e img02) che si alternano e quindi non posso inserirle come background
Io avevo impostato il codice html
<div id="header">
<div id="header_sx">
<img src="pic/img.jpg" alt="Nonna Iuccia" width="100%" height="200px" />
</div>
<div id="header_dx">
<div class="imageSlideshowHolder" id="imageSlideshowHolder">
<img src="pic/img01.jpg" width="100%" height="300px" />
<img src="pic/img02.jpg" width="100%" height="300px" />
</div>
<script type="text/javascript">
initImageGallery('imageSlideshowHolder');
</script>
</div>
<div>
con il codice css
/*header*/
#header {width:100%; background-color:#9a4233; height:350px; display:block;}
#header_sx {float:left; margin-left:3%; margin-top:5%; border:1px solid red;}
#header_dx {float:right; border:1px solid red; margin-right:3%;}
ma con una diversa risoluzione l'immagine rimane con le stesse dimensioni ed ottengo una disposizione diversa delle immagini.
Ho letto che si può impostare l'immagine di sfondo direttamente nel css, il problema è per le due immagini (img01 e img02) che si alternano e quindi non posso inserirle come background