Blitz - WPT: initial-color-background-001.html

wpt / css / css-cascade / initial-color-background-001.html

/css/css-cascade/initial-color-background-001.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>CSS Cascade: the "initial" value</title>
  <link rel="author" title="Chris Rebert" href="http://chrisrebert.com">
  <link rel="help" href="http://www.w3.org/TR/css-cascade-3/#initial">
  <link rel="help" href="http://www.w3.org/TR/css-cascade-4/#initial">
  <link rel="match" href="initial-color-background-001-ref.html">
  <meta name="assert" content="initial is not the same as inherit. color:initial results in non-red. background-color:initial results in transparent.">
  <style>
body {
  background-color: white;
}
div {
  font-size: 100px;
}
.outer {
  color: red;
}
.inner {
  background-color: red;
}
.inner {
  color: initial;/* normally black, almost certainly not red */
  background-color: initial;/* transparent, so the body's white will show thru */
}
  </style>
</head>
<body>
  <p>Test passes if there is a "W" and <strong>no red</strong>.</p>
  <div class="outer">
    <div class="inner">W</div>
  </div>
</body>
</html>

/css/css-cascade/initial-color-background-001-ref.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>CSS Cascade "W" Reference File</title>
  <link rel="author" title="Chris Rebert" href="http://chrisrebert.com">
  <style>
body {
  background-color: white;
}
div {
  font-size: 100px;
}
  </style>
</head>
<body>
  <p>Test passes if there is a "W" and <strong>no red</strong>.</p>
  <div>W</div>
</body>
</html>