Click me


HTML5/CSS4 QUIZ In a world that is mobile and local at the very same time, HTML5 is becoming the bridge between platforms. HTML5 is the future technology of choice for developing cross-functional websites and web applications. Are your coding skills on par for the future of software development? Test your knowledge of HTMLS and CSS4 to see if you're making the grade. EASY 1. Which doctype is correct for HTML5? a. <!DOCTYPE HTML PUBLIC "//W3C/DTD HTML 5.0/EN" ""> b. <!DOCTYPE HTML5> <!DOCTYPE html> C. 2. What is the correct HTML5 element for playing audio files? a. caudio> b. <mp3> <sound C. 3. Which of the following elements is a new HTML5 element? a. pre> b. <fieldset C. MEDIUM 4. The canvas element, introduced in HTML5, is used to... a. Interface with a remote server b. Draw graphics d. Find out the location of a user c. Create editable tables 5. Which is the correct HTML5 element to play a video in a web page? a. <movie src-"nairobi.flv" controls-"controls"></movie> b. <video src=" nairobi.flv" controls="controls"></video> c. plugin src-"nairobi.flv" controls-"controls"></plugin> d. cautoplaysre="nairobi.flv" controls="controls"></autoplay> 6. In HTML5, which method is used to get the current location of a user? getPosition() b. getUserPosition() c. getCurrentPosition) a. 7. What language is used to render 2D graphics in HTML5? a. Canvas b. Graphics C. SVG ADVANCED 8. In HTML5, you can "grab" any element and drag it to a different location. False b. True a. 9. Which HTML5 element is used to display a scalar measurement within a known range? <range> b. <meter> c. <gauge d. <measure> a. 10. How is server request data stored in HTML5? Web Storage b. Cookies c. Server Sessions a. Answer 1. <!DOCTYPE html> 2. <audio> Code: Code : <!DOCTYPE html> <audio controls> <source src="audio.ogg" <head> type="audio/ogg"> <meta charset="UTF-8"> <source src="audio.mp3" <title>Title of the document</title> type="audio/mpeg"> </head> Your browser does not support <body> The audio element. Content of the document...... </audio> </body> </html> 3. <nav> Code: <nav> <a href-"home.html">Home</a> | <a href-"about.html">About Us</a> | <a href-"products.html">Products</a> <a href-"contacts.html">Contact</a> </nav> 4. <draw graphics> Code: <!DOCTYPE html> <html> <body> <p>Image to use:</p> <img id-"scream" sIc-"img_the_scream.jpg" alt-"The Scream" width-"220" height="277"><p>Canvas:</p> <canvas id-"myCanvas" width-"250" height="300" style-"border:1px solid #d3d3d3; "> Your browser does not support the HTML5 canvas tag. </canvas> <acript> var c-document.getElementById ("myCanvas"): varctx-c.getContext ("2d"); varimg-document.getElementById ("scream"): ctx.drawImage (img, 10, 10): </script> </body> </html> 5. <video src=" nairobi.flv" controls="controls"></video> Code: <video reload-"metadata"> <source src="nairobi.mp4" type="video/mp4" /> </video> 6. getCurrentPosition () Code: <!DOCTYPE html> <html> <body> <button onclick="getLocation () ">View your Location Coordinates</button> <script> var x=document.getElementById ("demo") : functiongetLocation () if (navigator.geolocation) navigator.geolocation.getcurrentPosition (showPosition); else(x.innerHTML="Geolocation is not supported by this browser.";} functionshowPosition (position) x.innerHIML="Latitude:" + position.coords.latitude + "<br>Longitude:" + position.coords.longitude; </script> </body> Latitude: 0.282731 </html> Longitude: 34.751863 7. SVG 8. True Code: HELLO <!DOCTYPE html> <html> <body> <svgxmlna-"" HELO version="1.0" height="190"> <polygon points-"100, 10 40, 180 190,60 10,60 160,180" atyle="fill:grey;stroke:blue;str oke-width:5;fill-rule:evenodd; "> HELLO </svg> </body> </html> <meter> Code: 0% 25% 50% 75% 100% <dl> <dt>0</dt> <dd><meter min-"145" value-"800" title-"pounds">£145</meter></dd> <dt>25%</dt> <dd><meter min-"0" max-"1000" low-"50" high="125" value-"250" optimum-"145" title-"pounds">25%</meter></dd> <dt>50%</dt> <dd><meter min-"0" max-"1000" low-"50" high="125" value-"500" optimum-"145" title-"pounds">504</meter></dd> <dt>75</dt> <dd><meter min-"0" max-"1000" low-"50" high="125" value-"750" optimum-"145" title-"pounds ">754</meter></dd> <dt>1008</dt> <dd><meter min-"0" max-"1000" low-"50" high="125" value-"1000" optimum-"145" title-"pounds ">100%</meter></dd> </dl> </body> 10. Web storage Code: <!DOCTYPE html> <html> <body> <div id="result"></div> <script> if (typeof (Storage) !=="undefined")"David Kirui"; document.getElementById ("result").innerHIML="Name : " +; else document.getElementById ("result").innerHIML="Sorry, your browser does not support web storage..."; </script> </body> SMARTBEAR </html>


shared by singlegrain2013 on Feb 18
For developers and programmers, this is a quiz to test your level of proficiency on HTML 5.




Did you work on this visual? Claim credit!

Get a Quote

Embed Code

For hosted site:

Click the code to copy


Click the code to copy
Customize size