2017-10-02 8 views
-4

Können Sie sich bitte diese Demo ansehen und mir mitteilen, warum ich die Klasse dot im Canvas nicht sehen kann?Div in Canvas nicht zu sehen

canvas { 
 
    height: 200px; 
 
    width: 200px; 
 
    background: white; 
 
    position: relative 
 
} 
 
.overlay { 
 
    position: absolute; 
 
    top: 20px; 
 
    left: 30px; 
 
} 
 
.dot { 
 
    background: #eee; 
 
    height: 10px; 
 
    width: 10px; 
 
    border-radius: 25px; 
 
}
<canvas id="map"> 
 
    <div class="overlay"> 
 
    <div class="dot"> 
 
    </div> 
 
    </div> 
 
</canvas>

+0

Der Inhalt der Zeichenfläche wird als alternativer Inhalt für Browser verwendet, die die Zeichenfläche nicht zeichnen können. – LordNeo

+3

'' Element wird verwendet, um Grafiken zu zeichnen, im laufenden Betrieb, über JavaScript. Es wird keine HTML-Tags innerhalb nehmen. –

+0

auch, wenn Sie HTML innerhalb eines Canvas (Captcha zum Beispiel) zeichnen möchten, können Sie einen Blick auf diesen Artikel: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Drawing_DOM_objects_into_a_canvas – LordNeo

Antwort

0

Von https://www.w3schools.com/html/html5_canvas.asp:

Das HTML <canvas> Element verwendet wird Grafiken zu zeichnen, on the fly, über JavaScript.

Alle html innerhalb des <canvas> Element als alternative content behandelt in Browsern unterstützt <canvas> nicht angezeigt werden.