Beispiel:CSS2 max-width.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0" >
  <link rel="stylesheet" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css">
  <title>width und max-width</title>
  <style>
figure {
	width: 25em;
	padding: 0.5em;
	border: thin solid;
}

figure .max100 {
  max-width: 100%;
}

body > img {
	width: 100%;
  max-width:  60em;
}

figcaption {
	text-align: center;
}

  </style>	
</head>
 
<body>
<h1>width und max-width</h1>
  
<figure>
  <img src="//wiki-test.selfhtml.org/images/5/54/Landscape.svg" alt="landscape of Toscana">
  <figcaption>ohne Größenfestlegung</figcaption>
</figure>

<figure>
  <img  class="max100" src="//wiki-test.selfhtml.org/images/5/54/Landscape.svg" alt="landscape of Toscana">
  <figcaption>max-width: 100%;</figcaption>
</figure>  

  <img src="//wiki-test.selfhtml.org/images/5/54/Landscape.svg" alt="landscape of Toscana">
</body>
</html>
Abgerufen von „http://wiki.selfhtml.org/index.php?title=Beispiel:CSS2_max-width.html&oldid=82938“