{"id":598,"date":"2022-03-04T02:11:44","date_gmt":"2022-03-04T02:11:44","guid":{"rendered":"https:\/\/emorah.com\/story\/?p=598"},"modified":"2022-03-15T04:09:52","modified_gmt":"2022-03-15T04:09:52","slug":"html5-semantics-elements-fresco-play-hands-on-solutions","status":"publish","type":"post","link":"https:\/\/emorah.com\/story\/fresco-play\/html5-semantics-elements-fresco-play-hands-on-solutions\/","title":{"rendered":"HTML5 Semantics Elements Fresco Play Hands-On Solutions"},"content":{"rendered":"\n

HTML5 Semantics Elements Fresco Play Hands-On Solutions<\/p>\n\n\n\n

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.<\/strong>Try to understand these solutions and solve your Hands-On problems. (Not encourage copy and paste these solutions)<\/strong><\/p>\n\n\n\n

Please follow the below steps before Run Tests<\/strong> to run your code successfully otherwise you will face some server issues even Hands-On code is correct.
Step 1: Run->InstallStep 2: Run->RunStep 3: Run Tests<\/p>\n\n\n\n

1.Html5-header(15 Min)<\/strong><\/p>\n\n\n\n

File Name: index.html<\/strong><\/p>\n\n\n\n

<!DOCTYPE html><\/p>\n\n\n\n

<html><\/p>\n\n\n\n

<head><\/p>\n\n\n\n

<link rel=”icon” href=”favicon.png” type=”image\/png”><\/p>\n\n\n\n

<title>Destiny<\/title><\/p>\n\n\n\n

<link href=”mystyle.css” rel=”stylesheet” type=”text\/css”><\/p>\n\n\n\n

<\/head><\/p>\n\n\n\n

<body><\/p>\n\n\n\n

<header><\/strong><\/p>\n\n\n\n

<a><h1>WELCOME TO MY PAGE<h1><\/a><\/strong><\/p>\n\n\n\n

<\/header><\/strong><\/p>\n\n\n\n

<\/body><\/p>\n\n\n\n

<\/html><\/p>\n\n\n\n

<\/p>\n\n\n\n

2.HTML5 Navigation(20 Min)<\/strong><\/p>\n\n\n\n

File Name: index.html<\/strong><\/p>\n\n\n\n

<!DOCTYPE html><\/p>\n\n\n\n

<html><\/p>\n\n\n\n

<head><\/p>\n\n\n\n

<link href=”mystyle.css” rel=”stylesheet” type=”text\/css”><\/p>\n\n\n\n

<\/head><\/p>\n\n\n\n

<body><\/p>\n\n\n\n

<nav><\/strong><\/p>\n\n\n\n

<a>HOME<\/a> |<\/strong><\/p>\n\n\n\n

<a>Blog<\/a> |<\/strong><\/p>\n\n\n\n

<a>Videos<\/a> |<\/strong><\/p>\n\n\n\n

<a>About Me<\/a><\/strong><\/p>\n\n\n\n

<\/nav><\/strong><\/p>\n\n\n\n

<\/body><\/p>\n\n\n\n

<\/html><\/p>\n\n\n\n

3.Html5-footer(15 Min)<\/strong><\/p>\n\n\n\n

File Name: index.html<\/strong><\/p>\n\n\n\n

<!DOCTYPE html><\/p>\n\n\n\n

<html><\/p>\n\n\n\n

<head><\/p>\n\n\n\n

<link rel=”icon” href=”favicon.png” type=”image\/png”><\/p>\n\n\n\n

<title>Destiny<\/title><\/p>\n\n\n\n

<link href=”mystyle.css” rel=”stylesheet” type=”text\/css”><\/p>\n\n\n\n

<\/head><\/p>\n\n\n\n

<body><\/p>\n\n\n\n

<footer><\/strong><\/p>\n\n\n\n

<p>Copyright @ test<\/p><\/strong><\/p>\n\n\n\n

<\/footer><\/strong><\/p>\n\n\n\n

<\/body><\/p>\n\n\n\n

<\/html><\/p>\n\n\n\n

4.HTML 5 Registration(25 Min)<\/strong><\/p>\n\n\n\n

File Name: <\/strong>index.html<\/strong><\/p>\n\n\n\n

<!DOCTYPE html><\/p>\n\n\n\n

<html><\/p>\n\n\n\n

<head><\/p>\n\n\n\n

<link rel=”icon” href=”favicon.png” type=”image\/png”><\/p>\n\n\n\n

<title>Destiny<\/title><\/p>\n\n\n\n

<link href=”mystyle.css” rel=”stylesheet” type=”text\/css”><\/p>\n\n\n\n

<\/head><\/p>\n\n\n\n

<body><\/p>\n\n\n\n

\/\/write your code here<\/p>\n\n\n\n

<h1>Registration Form<\/h1><\/strong><\/p>\n\n\n\n

<form><\/strong><\/p>\n\n\n\n

Name: <input type=”text”><\/strong><\/p>\n\n\n\n

Date of Birth: <input type=”date”><\/strong><\/p>\n\n\n\n

country: <input list=”country”><\/strong><\/p>\n\n\n\n

<datalist id=”country”><\/strong><\/p>\n\n\n\n

<option value=”India”><\/strong><\/p>\n\n\n\n

<option value=”United States”><\/strong><\/p>\n\n\n\n

<option value=”United Kingdom”><\/strong><\/p>\n\n\n\n

<option value=”Australia”><\/strong><\/p>\n\n\n\n

<option value=”France”><\/strong><\/p>\n\n\n\n

<\/datalist><\/strong><\/p>\n\n\n\n

Phone number: <input type=”tel”><\/strong><\/p>\n\n\n\n

Email: <input type=”email”><\/strong><\/p>\n\n\n\n

website: <input type=”url”><\/strong><\/p>\n\n\n\n

<\/form><\/strong><\/p>\n\n\n\n

<\/body><\/p>\n\n\n\n

<\/html><\/p>\n\n\n\n

5.Html5-Audio(20 Min)  | html5-music player<\/strong><\/p>\n\n\n\n

File Name: <\/strong>index.html<\/strong><\/p>\n\n\n\n

<!DOCTYPE html><\/p>\n\n\n\n

<html><\/p>\n\n\n\n

<head><\/p>\n\n\n\n

<link rel=”icon” href=”favicon.png” type=”image\/png”><\/p>\n\n\n\n

<title>Destiny<\/title><\/p>\n\n\n\n

<link href=”mystyle.css” rel=”stylesheet” type=”text\/css”><\/p>\n\n\n\n

<\/head><\/p>\n\n\n\n

<body><\/p>\n\n\n\n

\/\/ write your code<\/p>\n\n\n\n

<audio controls><\/strong><\/p>\n\n\n\n

<source src=”SampleAudio.mp3″ type=”audio\/mpeg”><\/strong><\/p>\n\n\n\n

<\/audio><\/strong><\/p>\n\n\n\n

<audio controls preload=”none”><\/strong><\/p>\n\n\n\n

<source src=”SampleAudio.mp3″ type=”audio\/mpeg”><\/strong><\/p>\n\n\n\n

<\/audio><\/strong><\/p>\n\n\n\n

<audio controls loop><\/strong><\/p>\n\n\n\n

<source src=”SampleAudio.mp3″ type=”audio\/mpeg”><\/strong><\/p>\n\n\n\n

<\/audio><\/strong><\/p>\n\n\n\n

<\/body><\/p>\n\n\n\n

<\/html><\/p>\n\n\n\n

6.HTML5-Video Player(25 Min)<\/strong><\/p>\n\n\n\n

File Name: <\/strong>index.html<\/strong><\/p>\n\n\n\n

<!DOCTYPE html><\/p>\n\n\n\n

<html><\/p>\n\n\n\n

<head><\/p>\n\n\n\n

<link rel=”icon” href=”favicon.png” type=”image\/png”><\/p>\n\n\n\n

<title>Destiny<\/title><\/p>\n\n\n\n

<link href=”mystyle.css” rel=”stylesheet” type=”text\/css”><\/p>\n\n\n\n

<\/head><\/p>\n\n\n\n

<body><\/p>\n\n\n\n

\/\/write your code here<\/p>\n\n\n\n

<video controls autoplay><\/strong><\/p>\n\n\n\n

<source src=”video.mp4″ type=”video\/mp4″><\/strong><\/p>\n\n\n\n

<\/video><\/strong><\/p>\n\n\n\n

<video controls preload=”none”><\/strong><\/p>\n\n\n\n

<source src=”video.mp4″ type=”video\/mp4″><\/strong><\/p>\n\n\n\n

<\/video><\/strong><\/p>\n\n\n\n

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

<source src=”video.mp4″ type=”video\/mp4″><\/strong><\/p>\n\n\n\n

<\/video><\/strong><\/p>\n\n\n\n

<\/body><\/p>\n\n\n\n

<\/html><\/p>\n\n\n\n

7.HTML5 Canvas(25 Min)<\/strong><\/p>\n\n\n\n

File Name: <\/strong>index.html<\/strong><\/p>\n\n\n\n

<!DOCTYPE html><\/p>\n\n\n\n

<html><\/p>\n\n\n\n

<head><\/p>\n\n\n\n

<link rel=”icon” href=”favicon.png” type=”image\/png”><\/p>\n\n\n\n

<title>Destiny<\/title><\/p>\n\n\n\n

<link href=”mystyle.css” rel=”stylesheet” type=”text\/css”><\/p>\n\n\n\n

<\/head><\/p>\n\n\n\n

<body><\/p>\n\n\n\n

<canvas id=”GFG”<\/strong><\/p>\n\n\n\n

width=”600″<\/strong><\/p>\n\n\n\n

height=”400″><\/strong><\/p>\n\n\n\n

<\/canvas><\/strong><\/p>\n\n\n\n

<script><\/strong><\/p>\n\n\n\n

var x =<\/strong><\/p>\n\n\n\n

document.getElementById(“GFG”);<\/strong><\/p>\n\n\n\n

var ctx = x.getContext(“2d”);<\/strong><\/p>\n\n\n\n

ctx.strokeRect(20, 20, 200, 100);<\/strong><\/p>\n\n\n\n

ctx.stroke();<\/strong><\/p>\n\n\n\n

<\/script><\/strong><\/p>\n\n\n\n

<\/body><\/p>\n\n\n\n

<\/html><\/p>\n","protected":false},"excerpt":{"rendered":"

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 […]<\/p>\n","protected":false},"author":3,"featured_media":605,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"content-type":""},"categories":[156],"tags":[],"_links":{"self":[{"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/posts\/598"}],"collection":[{"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/comments?post=598"}],"version-history":[{"count":3,"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/posts\/598\/revisions"}],"predecessor-version":[{"id":607,"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/posts\/598\/revisions\/607"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/media\/605"}],"wp:attachment":[{"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/media?parent=598"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/categories?post=598"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/emorah.com\/story\/wp-json\/wp\/v2\/tags?post=598"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}