Blitz - WPT: attr-notype-fallback.html

wpt / css / css-values / attr-notype-fallback.html

/css/css-values/attr-notype-fallback.html

<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-values-5/#attr-notation">
<link rel="match" href="attr-notype-fallback-ref.html">
<style>
  #one::after {
    content: attr(does-not-exist, "Fallback value");
  }

  #two::after {
    content: attr(does-exist, "Fallback value");
  }

  #three::after {
    content: attr(does-not-exist, invalid);
  }

  #four::after {
    content: attr(does-exist, invalid);
  }

  #five::after {
    content: attr(does-exist, "Fallback value");
  }

  #six::after {
    content: attr(does-exist, "Fallback value");
  }
</style>

<div id="one"></div>
<div id="two" does-exist="Not fallback value"></div>
<div id="three"></div>
<div id="four" does-exist="Not fallback value"></div>
<div id="five" does-exist=""></div>
<div id="six" does-exist></div>

/css/css-values/attr-notype-fallback-ref.html

<!DOCTYPE html>
<style>
  #one::after {
    content: "Fallback value";
  }

  #two::after {
    content: "Not fallback value";
  }

  #three::after {
    content: "";
  }

  #four::after {
    content: "Not fallback value";
  }

  #five::after {
    content: "";
  }

  #six::after {
    content: "";
  }
</style>

<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
<div id="four"></div>
<div id="five"></div>
<div id="six"></div>