Download our latest MNC Answers Application at Play Store. Download Now
Home
Fresco Play
fresco play hands on answers

HTML5 Semantics Elements Hands-On Solutions | TCS Fresco Play


HTML5 Semantics Elements Fresco Play Hands-On Solutions

Disclaimer: The primary purpose of providing this solution is to assist and support anyone who are unable to complete these courses due to a technical issue or a lack of expertise. This website's information or data are solely for the purpose of knowledge and education.

Make an effort to understand these solutions and apply them to your Hands-On difficulties. (It is not advisable that copy and paste these solutions).

Course Path: Modern Web Development/WEB BASICS/HTML5 Semantic Elements

Please follow the below steps before Run Tests to run your code successfully otherwise you will face some server issues even Hands-On code is correct.

Step 1: Run->Install
Step 2: Run->Run
Step 3: Run Tests


1.Html5-header(15 Min)


File Name: index.html


<!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><h1>WELCOME TO MY PAGE<h1></a>

</header>

</body>

</html>


2.HTML5 Navigation(20 Min)



File Name: index.html


<!DOCTYPE html>

<html>

<head>

<link href="mystyle.css" rel="stylesheet" type="text/css">

</head>

<body>

<nav>

<a>HOME</a> |

<a>Blog</a> |

<a>Videos</a> |

<a>About Me</a>

</nav>

</body>

</html>


3.Html5-footer(15 Min)



File Name: index.html


<!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 @ NOTES BEREAU</p>

</footer>

</body>

</html>


4.HTML 5 Registration(25 Min)



File Name: index.html


<!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>

//write your code here

<h1>Registration Form</h1>

<form>

Name: <input type="text">

Date of Birth: <input type="date">

country: <input list="country">

<datalist id="country">

<option value="India">

<option value="United States">

<option value="United Kingdom">

<option value="Australia">

<option value="France">

</datalist>

Phone number: <input type="tel">

Email: <input type="email">

website: <input type="url">

</form>

</body>

</html>


5.Html5-Audio(20 Min)  | html5-music player



File Name: index.html


<!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>

// write your code

<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>


6.HTML5-Video Player(25 Min)



File Name: index.html


<!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>

//write your code here

<video controls autoplay>

<source src="video.mp4" type="video/mp4">

</video>

<video controls preload="none">

<source src="video.mp4" type="video/mp4">

</video>

<video controls poster="https://cdn12.picryl.com/photo/2016/12/31/lego-stones-plastic-education-8b9a7d-1024.jpg">

<source src="video.mp4" type="video/mp4">

</video>

</body>

</html>


7.HTML5 Canvas(25 Min)




File Name: index.html


<!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="GFG"

width="600"

height="400">

</canvas>

<script>

var x =

document.getElementById("GFG");

var ctx = x.getContext("2d");

ctx.strokeRect(20, 20, 200, 100);

ctx.stroke();

</script>

</body>

</html>



If you have any queries, please feel free to ask on the comment section.

If you want MCQs and Hands-On solutions for any courses, Please feel free to ask on the comment section too.

4 comments

  1. THANKS
  2. Hii html 5 , 4 no question for create registration exam answer is I think wrong as I execute so many times the same but showing wrong, kindly suggest
    • Would you please tell us, What the error are you facing exactly?. Because, this code contains no error which we tried with ourselves. Please check your code twice with these answers before submitting. Thanks!
    • If you are facing the same error again and again. Please, share your exact error with us, we will help you.