Rozciągnij obraz, aby wypełnić szerokość okna przeglądarki.

Question

Mam obraz i chcę, aby szerokość wypełniała okno przeglądarki, bez względu na rozmiar okna.

Jak to zrobić w HTML i CSS?

Answer 1

<img src="filename.jpg" alt="alt text" width="100%" /> 

Zakłada się, że kontener obrazu jest tak szeroki, jak okno przeglądarki.

Answer 2

Możesz dodać div o szerokości o wysokości 100%, szerokość również set zdjęcie i wysokość są 100%

<div id="wrapper"> 
    <img src="http://lorempixel.com/200/200" /> 
</div>​​​​​​​​​​ 

CSS:

#wrapper, img{ 
    width:100%; 
    height: 100%; 
} 

jsfiddle

Answer 3

<div class="fixpixel"> 
    <img src="ImagePath" /> 
</div>​​​​​​​​​​ 

Plik CSS

.fixpixel img{ 
height: auto; 
background-position: center; 
background-repeat: no-repeat; 
background-size: cover; 
}