4 Bild egenskaper

  • Gör så att bilden A nedan blir hälften så bred.
  • Gör så att bilden B nedan blir dubelt så hög.
  • Gör så att bilden C nedan blir hälften så bred. Men forfarande lika hög.
  • Gör så att bilden D nedan blir hälften så bred. Men forfarande lika hög.
  • Gör så att bilden E nedan blir den klart bredaste bilden, men bevara bildkvot("aspect ratio").
  • Gör så att bilden F nedan bilden blir kvadratiskt.

Kod


<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="utf-8" />
<style>
	</style>
	<style>
	     img {
			 margin: 10px;
		     width: 320px;
		     height: 240px;
		 } 
	</style>
</head>
<body>
<h1> Image </h1>
<h1> A </h1>
<img id="image-1" src="https://htsit.se/image/daisy.jpg" />
<h1> B </h1>
<img id="image-2" src="https://htsit.se/image/daisy.jpg" />
<h1> C </h1>
<img id="image-3" src="https://htsit.se/image/daisy.jpg" />
<h1> D </h1>
<img id="image-4" src="https://htsit.se/image/daisy.jpg" />
<h1> E </h1>
<img id="image-5" src="https://htsit.se/image/daisy.jpg" />
<h1> F </h1>
<img id="image-6" src="https://htsit.se/image/daisy.jpg" />
</body>
</html>
  

Du ska bara lägga till något mellan style-tagarna.