<canvas> - HTML5 elementer

HTML5 elementer, forklaring og eksempler - <canvas>

<canvas>

Definer et område hvor der kan tegnes bitmap grafik for eksempel med JavaScript.

Til at starte med er <canvas> gennemsigtigt så man kan ikke se det før man tegne noget.
Men man kan give det en ramme med CSS så det er let at se hvor canvaset er.

The canvas element represents a resolution-dependent bitmap canvas, which can be used for dynamically rendering of images such as game graphics, graphs, or other images.
Kilde : w3.org

Browserunderstøttelse fra caniuse.com :


Her ses hvordan <canvas> elementet bruges.

Alt hvad der skal tegnes på <canvas> sker fra for eksempel JavaScript.

Her laves et <canvas> som er 400 pixels bredt og 300 pixels højt.

Da <canvas> er gennemsigtigt kan man ikke se det før der er tegnet noget.
Derfor kan man eventuelt lave en ramme med CSS omkring canvaset så det er let at se hvor det er.
Browseren understøtter ikke <canvas>
Resultatet ovenfor er skabt af følgende kode

Skriv din kommentar

Spørg mig om hvad som helst
Du kan også skrive direkte til mig på
Stem
Søg
Emner
Language

Select English to navigate the website in English. Things like the navigation menu and contact form will be in English, but the main content on each page will not be translated.