Können Canvas-Elemente als CSS-Hintergründe verwendet werden?

<p>

Mit als CSS-Hintergrund

<p>Frage: Ist es möglich, das Element als Hintergrund in CSS?

<p>Antwort: Ja, es ist möglich, als Hintergrund in CSS, derzeit sowohl von WebKit als auch von Firefox unterstützt.

<p>WebKit-Unterstützung:

<p>Seit 2008 erlaubt WebKit die Verwendung von als CSS-Hintergrund. Hier ist ein Beispiel:

<div>
  <style>
    div {
      background: -webkit-canvas(squares);
      width: 600px;
      height: 600px;
      border: 2px solid black;
    }
  </style>

  <script type="application/x-javascript">
    function draw(w, h) {
      var ctx = document.getCSSCanvasContext("2d", "squares", w, h);

      ctx.fillStyle = "rgb(200, 0, 0)";
      ctx.fillRect(10, 10, 55, 50);

      ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
      ctx.fillRect(30, 30, 55, 50);
    }
  </script>
</div>

<p>Firefox-Unterstützung:

<p>Firefox 4 hat eine Funktion eingeführt, die es ermöglicht, jedes Element (einschließlich Leinwand) als CSS-Hintergrund zu verwenden:

<p>

<p>Weitere Details finden Sie unter Mozilla-Hacks.

Das obige ist der detaillierte Inhalt vonKönnen Canvas-Elemente als CSS-Hintergründe verwendet werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!