Quelle inspector-styles-data.html Sprache: HTML

products/Sources/formale Sprachen/C/Firefox/devtools/server/tests/chrome/inspector-styles-data.html

<html>
<script>
  "use strict";

  window.onload = () => {
    window.opener.postMessage("ready", "*");
  };
</script>
<style>
  .inheritable-rule {
    font-size: 15px;
  }
  /* Has to be on one line, is such for test */
  .column-rule { font-size: 20px; } .column-rule { font-size: 25px; }
  .uninheritable-rule {
    background-color: #f06;
  }
  @media screen {
    #mediaqueried {
      background-color: #f06;
    }
  }
  #svgcontent rect {
    fill: rgb(1,2,3);
  }

  #layout-element,
  #layout-auto-margin-element {
    width: 50px;
    height: 50px;
    padding: 3px 5px 7px 5px;
    border: 5px solid red;
    margin: 10px 20px 30px 0;
    box-sizing: border-box;
    position: absolute;
    z-index: 2;
  }

  #layout-auto-margin-element {
    margin: 10px auto;
  }
</style>
<link type="text/css" rel="stylesheet" href="inspector-styles-data.css"></link>
<body>
  <h1>Style Actor Tests</h1>
  
  <div id="inheritable-rule-uninheritable-style" class="inheritable-rule" style="background-color: purple">
    <div id="inheritable-rule-inheritable-style" class="inheritable-rule" style="color: blue">
      <div id="uninheritable-rule-uninheritable-style" class="uninheritable-rule" style="background-color: green">
        <div id="uninheritable-rule-inheritable-style" class="uninheritable-rule" style="color: red">
          <div id="test-node">
            Here is the test node.
          </div>
        </div>
      </div>
    </div>
  </div>

  
  <div id="computed-parent" class="external-rule inheritable-rule uninheritable-rule" style="color: red;">
    <div id="computed-test-node" class="external-rule">
      Here is the test node.
    </div>
  </div>

  
  <div id="matched-parent" class="external-rule inheritable-rule column-rule uninheritable-rule" style="color: red;">
    <div id="matched-test-node" style="font-size: 10px" class="external-rule">
      Here is the test node.
    </div>
  </div>

  <div id="mediaqueried">
    Screen mediaqueried.
  </div>

  <div id="svgcontent">
    <svg><rect></rect></svg>
  </div>

  <div id="layout-element">I can has layout</div>
  <div id="layout-auto-margin-element">I can has layout too</div>

</body>
</html>

quality100%

¤ Dauer der Verarbeitung: 0.3 Sekunden ¤

Wurzel

Suchen

Beweissystem der NASA

Beweissystem Isabelle

NIST Cobol Testsuite

Cephes Mathematical Library

Wiener Entwicklungsmethode

Haftungshinweis

Die Informationen auf dieser Webseite wurden nach bestem Wissen sorgfältig zusammengestellt. Es wird jedoch weder Vollständigkeit, noch Richtigkeit, noch Qualität der bereit gestellten Informationen zugesichert.

Bemerkung:

Die farbliche Syntaxdarstellung ist noch experimentell.