এইচটিএমএল গ্রাফিক্স ক্যানভাস উপাদান (The HTML Graphics Canvas element)

<canvas>: এইচটিএমএল গ্রাফিক্স ক্যানভাস উপাদান (The HTML Graphics Canvas element)। এই ট্যাগ সাধারণত জাভাস্ক্রিপ্ট এর সঙ্গে প্রচুর ব্যবহার হয়। এখানে কিছু উদাহারন দেওয়া হল। জাভাস্ক্রিপ্ট এর ব্যবহার এখানে দেওয়া হয় নি।

Example:1

<!--Example:1-->
    <div>
        <canvas width="200" height="200" style="border:1px solid red"></canvas>
    </div>
    <div>
        <canvas width="200" height="100" style="border:1px solid green"></canvas>
    </div>

Example:2

<!--Example:2 use class or id and use it on css or javascript-->
    <div>
        <canvas class="canvasclass" width="200" height="100" style="border:1px solid green"></canvas>
    </div>
    <div>
        <canvas id="canvasid" width="200" height="100" style="border:1px solid green"></canvas>
    </div>

    <style>
        .canvasclass {
            background-color: red;
        }

        #canvasid {
            background-color: blue;
        }
    </style>

Full Code:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTML MASTER JHUTANDA</title>
    <!--https://jhutanda.com-->
    <!--https://github.com/jhutanda-->
</head>

<body>
    <!--Example:1-->
    <div>
        <canvas width="200" height="200" style="border:1px solid red"></canvas>
    </div>
    <div>
        <canvas width="200" height="100" style="border:1px solid green"></canvas>
    </div>

    <!--Example:2 use class or id and use it on css or javascript-->
    <div>
        <canvas class="canvasclass" width="200" height="100" style="border:1px solid green"></canvas>
    </div>
    <div>
        <canvas id="canvasid" width="200" height="100" style="border:1px solid green"></canvas>
    </div>

    <style>
        .canvasclass {
            background-color: red;
        }

        #canvasid {
            background-color: blue;
        }
    </style>

</body>

</html>

Scroll to Top