Beispiel:CSS2 background-color-2.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche 
<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" media="screen" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css">
  <title>Durchsichtigkeit mit rgba</title>
<style>
body {
	background-color: DeepSkyBlue;
	  background-image:
repeating-linear-gradient(transparent, transparent 30px, white 30px, white 32px),
repeating-linear-gradient(to right, transparent, transparent 30px, white 30px, white 32px);
	color: midnightblue;
  height: 85vh;
}
      span {
        background: white;
        border: medium solid;
        cursor: help;
        display: inline-block;
        margin: 1em 2em;
        outline: medium solid red;
        padding: 1em 2em;
      }
.o0  { background-color: rgb(255 255 255 /0); }
.o2  { background-color: rgb(255 255 255 /0.2); }
.o4  { background-color: rgb(255 255 255 /0.4); }
.o6  { background-color: rgb(255 255 255 /0.6); }
.o8  { background-color: rgb(255 255 255 /0.8); }
.o10 { background-color: rgb(255 255 255 /1); }
</style>
</head>

<body>
<h1>Durchsichtigkeit mit rgb()</h1>
<p>
      <span class="o0" title="background-color: rgb(255 255 255 /0.0)">rgb(255 255 255 /0)</span>
      <span class="o2" title="background-color: rgb(255 255 255 /0.2)">rgb(255 255 255 /0.2)</span>
      <span class="o4" title="background-color: rgb(255 255 255 /0.4)">rgb(255 255 255 /0.4)</span>
      <span class="o6" title="background-color: rgb(255 255 255 /0.6)">rgb(255 255 255 /0.6)</span>
      <span class="o8" title="background-color: rgb(255 255 255 /0.8)">rgb(255 255 255 /0.8)</span>
      <span class="o10" title="background-color: rgb(255 255 255 /1)">rgb(255 255 255 /1)</span>
    </p>
<p>Ursprünglich verwendete das Beispiel die <code>rgba()</code>-Funktion. Im Februar 2022 wurde es durch die einfachere rgb()-Funktion mit Leerzeichen-separierten Werten ersetzt.</p>
</body>
</html>
Abgerufen von „http://wiki.selfhtml.org/index.php?title=Beispiel:CSS2_background-color-2.html&oldid=84823“