Latest Deals

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)



HTML5 Semantics Elements Fresco Play MCQs Answers


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.

Tags

15 Comments

Any comments and suggestion will be appreciated.

  1. UnknownSeptember 10, 2021 at 11:59 PM

    In html5 audio what things do we need to install before running the program?

    ReplyDelete
    Replies
    1. Notes BureauNovember 3, 2021 at 8:14 AM

      Just click on above Run tab and install, run after that Run Tests

      Delete
  2. UnknownSeptember 11, 2021 at 12:00 AM

    In audio HTML5 what are the package do we need to install before running the program?

    ReplyDelete
  3. UnknownSeptember 13, 2021 at 3:34 PM

    There's one npm error I'm getting while executing the audio code... How to rectify that in hacker rank?

    ReplyDelete
  4. UnknownSeptember 20, 2021 at 12:07 AM

    HTML 5 Registratio is not cleared I have tried many times

    ReplyDelete
  5. UnknownSeptember 20, 2021 at 12:08 AM

    HTML 5 Registration is not cleared tried many times

    ReplyDelete
    Replies
    1. Notes BureauNovember 3, 2021 at 8:12 AM

      What error you are getting can you please specify.

      Delete
  6. UnknownSeptember 22, 2021 at 11:47 AM

    Navigation code is not executing

    ReplyDelete
  7. MahimaSeptember 27, 2021 at 4:17 PM

    Html semantic elements Audio and video hands on not working for me

    ReplyDelete
    Replies
    1. Notes BureauNovember 3, 2021 at 8:15 AM

      What error you are getting can you please specify.

      Delete
  8. UnknownOctober 25, 2021 at 11:18 PM

    Registration form is cleared

    ReplyDelete
    Replies
    1. Notes BureauNovember 3, 2021 at 8:14 AM

      Ohhh Nice. If you any further help fill free to ask.

      Delete
    2. UnknownDecember 1, 2021 at 11:05 AM

      what you updated in this code please tell me I'm not able to clear this question with this code.

      Delete
    3. Notes BureauDecember 1, 2021 at 7:03 PM

      What error you are getting can you please specify. Also you can mail Screenshot of error to notesbureau2021@gmail.com

      Delete

Post a Comment

Any comments and suggestion will be appreciated.

Previous Post Next Post

Join Telegram Channel

Join Notes Bureau Lets Teach and Learn

Join Telegram Channel