Skip to main content

Posts

Showing posts from August, 2022

HTML5 Semantics | Fresco Play | Hands On 7 | Canvas

In this blog post, I am going to explain how to solve the below hands on. Embed a canvas of width 600 and height 400 in your HTML5 page. draw a red rectangle of width 200 and height 100 on canvas,leaving a margin of 20 on both x axis and y axis.Add a stroke using 'strokeRect' method. ......................................................................................................................................... Answer: Code  inside the index.html is provided below : <!DOCTYPE html> <html> <head>   <link rel="icon" href="favicon.png" type="image/png">   <title>Destiny</title>   <link href="mystyle.css" rel="stylesheet" type="text/css"> </head> <body>    <canvas id="temp" width="600" height="400" ></canvas> <script> var x= document.getElementById("temp"); var ctx=x.getContext("2d"); ctx.stroke
Post a Comment
Read more

HTML5 Semantics | Fresco Play | Hands On 6 | Video.

   Question: In this blog Post I am going to explain you how we can solve the below handson. Embed a video in your HTML5 page with a width of '320' and height of '200' with controls displayed. Now, try to do the following: Creating 3 videos Auto-reply the first video preload the second video Display image while the third video loads. Question is provided in the snip below: ......................................................................................................................................... Answer: Code  inside the index.html is provided below : <!DOCTYPE html> <html> <head>   <link rel="icon" href="favicon.png" type="image/png">   <title>Destiny</title>   <link href="mystyle.css" rel="stylesheet" type="text/css"> </head> <body> <video controls autoplay> <source src="video.mp4"> </video>   <video controls prel
Post a Comment
Read more

HTML5 Semantics | Fresco Play | Hands On 5 | Audio.

 Question: Question is provided in the snip below: ......................................................................................................................................... Answer: Code  inside the index.html is provided below : <!DOCTYPE html> <html> <head>   <link rel="icon" href="favicon.png" type="image/png">   <title>Destiny</title>   <link href="mystyle.css" rel="stylesheet" type="text/css"> </head> <body> <audio controls > <source src="SampleAudio.mp3" type="audio/mpeg"> </audio> <audio  controls preload="none"> <source src="SampleAudio.mp3" type="audio/mpeg"> </audio> <audio controls loop>   <source src="SampleAudio.mp3" type="audio/mpeg"> </audio> </body> </html>
Post a Comment
Read more

HTML5 Semantics | Fresco Play | Hands On 4 | Registration form.

 Question : Question is provided in the snip below : ..................................................................................................................................... Code in the index.html file is given below : <!DOCTYPE html> <html> <head>   <link rel="icon" href="favicon.png" type="image/png">   <title>Destiny</title>   <link href="mystyle.css" rel="stylesheet" type="text/css"> </head> <body> <h1>Registration Form</h1> <form > Name: <input type="text"> Date of Birth: <input type="date"> Country: <input type="country"> <datalist id="country">   <option value="India">     <option value="United States">       <option value="United Kingdom">         <option value="Australia">           <option value="Fra
Post a Comment
Read more

HTML5 Semantics | Fresco Play | Hands On 3 | Footer

 Question: Question is provided in the snip below : ......................................................................................................................................... Answer: Answer is provided in the snip below : ......................................................................................................................................... Code in the index.html file is given below: <!DOCTYPE html> <html> <head>   <link rel="icon" href="favicon.png" type="image/png">   <title>Destiny</title>   <link href="mystyle.css" rel="stylesheet" type="text/css"> </head> <body>     <Footer>       <p>Copyright @ TCS 2016</p>     </Footer> </body> </html>
Post a Comment
Read more

HTML5 Semantics | Fresco Play | Hands On 2 | Navigation

 Question: Question is given in the below snip : ......................................................................................................................................... Answer : Answer is given in the below snip : ......................................................................................................................................... Code of index.html file is given below: <!DOCTYPE html> <html> <head>   <link href="mystyle.css" rel="stylesheet" type="text/css"> </head> <body>  <nav>    <a >Home</a>     <a >Blogs</a>      <a>Videos</a>       <a >About Me</a>  </nav> </body> </html> .........................................................................................................................................
Post a Comment
Read more

HTML5 Semantics | Fresco Play | Hands On 1 | header

Question  Question is given in the snip below : ......................................................................................................................................... Answer: Answer is given in the Snip below : ............................................................................................................................. code is given below: <!DOCTYPE html> <html> <head> <link rel="icon" href="favicon.png" type="image/png"> <title>Destiny</title> <link href="mystyle.css" rel="stylesheet" type="text/css"> </head> <body> <header> <a>WELCOME TO MY PAGE</a> </header> </body> </html> .........................................................................................................................................
Post a Comment
Read more