Sorry For Inconvenience, Site is Under Maintenance. Please Goto HomePage

HTML5 Semantics Elements Fresco Play Hands-On Solutions

Notes Bureau

HTML5 Semantics Elements Fresco Play Hands-On Solutions


Disclaimer: The main motive to provide this solution is to help and support those who are unable to do these courses due to facing some issue and having a little bit lack of knowledge. All of the material and information contained on this website is for knowledge and education purposes only.

Try to understand these solutions and solve your Hands-On problems. (Not encourage 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 want answers to any of the Fresco Play courses feel free to ask in the comment section, we will surely help.

15 comments

  1. In html5 audio what things do we need to install before running the program?
    1. Just click on above Run tab and install, run after that Run Tests
  2. In audio HTML5 what are the package do we need to install before running the program?
  3. There's one npm error I'm getting while executing the audio code... How to rectify that in hacker rank?
  4. HTML 5 Registratio is not cleared I have tried many times
  5. HTML 5 Registration is not cleared tried many times
    1. What error you are getting can you please specify.
  6. Navigation code is not executing
    1. can you please specify the error.
  7. Html semantic elements Audio and video hands on not working for me
    1. What error you are getting can you please specify.
  8. Registration form is cleared
    1. Ohhh Nice. If you any further help fill free to ask.
    2. what you updated in this code please tell me I'm not able to clear this question with this code.
    3. What error you are getting can you please specify. Also you can mail Screenshot of error to notesbureau2021@gmail.com
Any comments and suggestion will be appreciated.
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.

Join Telegram Channel

Join Notes Bureau Lets Teach and Learn

Join Telegram Channel
CLOSE ADS
CLOSE ADS