Tutorialspoint

HTML canvas fillStyle Property

<!DOCTYPE html>
<html>
   <body>
      <canvas id="newCanvas" width="500" height="350" style="border:2px solid orange;"></canvas>
      <script>
         var c = document.getElementById("newCanvas");
         var ctx = c.getContext("2d");
         var newGrad =ctx.createLinearGradient(0, 0, 130, 0);
         newGrad.addColorStop(0, "blue");
         newGrad.addColorStop(0.8, "green");
         ctx.fillStyle = newGrad;
         ctx.fillRect(0, 0, 500, 350);
      </script>
   </body>
</html>

HTML canvas fillRect() Method

<!DOCTYPE html>
<html>
   <body>
      <canvas id="newCanvas" width="500" height="350" style="border:2px solid orange;"></canvas>
      <script>
         var c = document.getElementById("newCanvas");
         var ctx = c.getContext("2d");
         ctx.fillStyle = "blue";
         ctx.fillRect(0, 0, 500, 350);
         ctx.clearRect(250, 100, 50, 100);
      </script>
   </body>
</html>

HTML button name Attribute

<!DOCTYPE html>
<html>
   <body>
      <form action="" method="get">
         Get the details of the employee:<br><br>
         <button name="details" type="submit" value="addr">Address</button>
         <button name="details" type="submit" value="ph">Phone</button>
         <button name="details" type="submit" value="appraisal">Appraisal %</button>
      </form>
   </body>
</html>

HTML area target Attribute

<!DOCTYPE html>
<html>
   <body>
      <h2>Learning</h2>
      <p>Learn these technologies with ease....</p>
      <img src = /images/usemap.gif alt = "usemap" border = "0" usemap = "#tutorials"/>
      <map name = "tutorials">
         <area shape = "poly" coords = "74,0,113,29,98,72,52,72,38,27"
            href = "/perl/index.htm" alt = "Perl Tutorial" target = "_blank"/>
         <area shape = "rect" coords = "22,83,126,125" alt = "HTML Tutorial"
            href = "/html/index.htm" target = "_blank" />
         <area shape = "circle" coords = "73,168,32" alt = "PHP Tutorial"
            href = "/php/index.htm" target = "_blank" />
      </map>
   </body>
</html>

HTML frame Tag

<!DOCTYPE html>
<html>
   <frameset cols="30%,30%,20%,20%">
      <frame src="https://www.tutorialspoint.com/codingground.htm"/>
      <frame src="https://store.tutorialspoint.com/">
      <frame src="https://www.tutorialspoint.com/tutorialslibrary.htm">
      <frame src="https://www.tutorialspoint.com/programming_examples">
   </frameset>
</html>

HTML form target Attribute

<!DOCTYPE html>
<html>
   <body>
      <h2>Points</h2>
      <form action="new.php" method="get" target="_blank">
         Player: <input type="text" name="player"><br>
         Rank: <input type="number" name="rank"><br>
         Points: <input type="number" name="points"><br>
         <button type="submit" value="Submit">Submit</button>
      </form>
   </body>
</html>

HTML area rel Attribute

<!DOCTYPE html>
<html>
   <body>
      <h2>Learning</h2>
      <p>Learn these technologies with ease....</p>
      <img src = /images/usemap.gif alt = "usemap" border = "0" usemap = "#tutorials"/>
      <map name = "tutorials">
         <area shape = "poly" coords = "74,0,113,29,98,72,52,72,38,27"
            href = "/perl/index.htm" alt = "Perl Tutorial" target = "_blank" rel="alternate"/>
         <area shape = "rect" coords = "22,83,126,125" alt = "HTML Tutorial"
            href = "/html/index.htm" target = "_blank" />
         <area shape = "circle" coords = "73,168,32" alt = "PHP Tutorial"
            href = "/php/index.htm" target = "_blank" />
      </map>
   </body>
</html>

HTML button autofocus Attribute

<!DOCTYPE html>
<html>
   <body>
      <h2>Demo Heading</h2>
      <p>This is a demo line.</p>
      <button type="button" autofocus >Demo</button>
   </body>
</html>

HTML blockquote cite Attribute

<!DOCTYPE html>
<html>
   <body>
      <h2>Magento</h2>
      <p>Magento as stated on the official website:</p>
      <blockquote cite="https://magento.com/products">
         Magento Commerce, part of Adobe Commerce Cloud, offers a one-of-a-kind eCommerce solution with enterprise power, unlimited scalability, and open-source flexibility for B2C and B2B experiences. Magento allows you to create unique, full-lifecycle customer experiences proven to generate more sales.
      </blockquote>
   </body>
</html>

HTML big Tag

<!DOCTYPE html>
<html>
   <body>
      <h2>Demo Heading</h2>
      <p>This is demo text!</p>
      <p><big>This demo text is bigger than the default text.</big></p>
   </body>
</html>

Previous 1 ... 4 5 6 7 8 9 10 ... 8409 Next
Advertisements
Loading...

We use cookies to provide and improve our services. By using our site, you consent to our Cookies Policy.