• phone icon +44 7459 302492 email message icon info@uplatz.com
  • Register
Job Meter = High

HTML5 and CSS3

15 Hours
Self-paced Training (pre-recorded videos)
USD 17 (USD 140)
Save 88% Offer ends on 31-Jul-2024
HTML5 and CSS3 course and certification
318 Learners

About this Course
HTML or HyperText Markup Language is a markup language specifically used to design the web pages of a website. With HTML, we can link different web pages to one another and also can re-design the colours and fonts used in the webpages of a website. HTML has got several versions of its own and the latest being the HTML5. With the inclusion of HTML5, a user can add his desired audio and video files within his website which was not available in the earlier versions of HTML.
CSS or Cascading Style Sheets is an integral element in Web Development which allows a user to give styling to a webpage such as colour, font, the position of the element etc. and also does animations for that website. CSS3 is the latest version of CSS which supports responsive design for the users and also can be split into different modules.
In this course curriculum, a learner will get to know about:

Introduction to HTML and CSS
Ø  Basic Formatting Tags used in HTML
Ø  HTML Grouping and Listing
Ø  How to create and design images using HTML
Ø  Hyperlink and Anchors
Ø  HTML Tables, iframe, Forms and Headers
Ø  CSS Selectors and Pseudo Classes
At the end of this course, one will have a Certificate of Completion on HTML5 and CSS3 from Uplatz.

HTML5 and CSS3

Course Details & Curriculum



·         History of HTML

·         What you need to do to get going and make your first HTML page

·         What are HTML Tags and Attributes?

·         HTML Tag vs. Element

·         HTML Attributes

·         How to differentiate HTML Document Versions

HTML - Basic Formatting Tag

·         HTML Basic Tags

·         HTML Formatting Tags

·         HTML Color Coding

HTML - Grouping Using Div Span


and element is the generic container for flow content and does not inherently represent anything. Use it to group elements for purposes such as styling (using the class or id attributes), and inline level and block level separation.

·         Div and Span Tags for Grouping

HTML - Lists


  • element is used to represent an item in a list. It must be contained in a parent


element: an ordered list (

      ), an unordered list (
        ), or a menu (
). In menus and unordered lists,

list items are usually displayed using bullet points, now we are going to check how to use html list.

·         Unordered Lists

·         Ordered Lists

·         Definition list

HTML - Images

·         Creating an image

·         Choosing alt text

·         Responsive image using the srcset attribute

·         Responsive image using picture element

HTML - Hyperlink & Anchors

·         Link to another site

·         Link to an anchor Link to a page on the same site Link that dials a number

·         Open link in new tab/window

·         Link that runs JavaScript Link that runs email client

HTML - Tables

·         Simple Table

·         Spanning columns or rows

·         Column Groups

·         Table with thead, tbody, tfoot

·         Heading scope

HTML - iframe


·         Attributes Using

·         iframe as the Target

HTML - Forms

·         Submitting

·         Target attribute in form tag

·         Uploading Files

·         Grouping a few input fields

HTML - Headers

The HTMLelement provides general information (metadata) about the document,

including its title and links to its scripts and style sheets.

·         Title

·         Base

·         Link

·         Styles

·         Script

HTML - Miscellaneous

The HTMLelement represents metadata that cannot be represented by other HTML

meta-related elements, like , ,


Career Path

Web Developer
Web Designer

Job Prospects


HTML5 and CSS3 Interview  Questions



1. What is the need of mentioning at the beginning of an HTML page?

The indicates the version of HTML which in this case is 5. The earlier versions like HTML4 were based on Standard Generalized Markup Language (SGML) and required a Document Type Definition (DTD). HTML5 however, is not based on SGML and doesn’t need a DTD.


2. List out the new Structural Elements in HTML5.

HTML5 introduced few structural elements to define different parts of a web page like article, header, footer, main, mark and many more.

These are sections in which a web page is usually divided into. In HTML4, the same was implemented using div with an id/class name to it.


3. What is the use of the article tag?

It defines space for an article that is independently distributable. For example, A magazine or newspaper article.


4. How can we produce a horizontal line on a webpage?

A horizontal line can be produced on a web page using the

tag. The other point to note about the hr tag is that it doesn’t have an end tag as most of the HTML tags do.


5. Why is the div tag so useful in developing HTML web pages?

The HTML div tag (ie


) is used to create a section of a web page. It can hold another sections or elements in it. It is also possible to hold direct text in it, but not the one that is used.


6. Define the types of HTML Headings.

HTML holds 6 types of headings starting from h1 to h6. The heading one (h1) is the maximum font and h6 is the minimum font.


7. How can we group heading elements?

All the heading tags or elements can be grouped together in hgroup tag:


Main heading




8. Define span tag.

A span tag is similar to div section but is used to divide the screen into even smaller sections. ...


9. Define Meta tags.

Meta tags are the tags that provide more information to our web pages. Some of the tags that are examples for meta are:

• Link: Defines a relation between the web page and an external source.

• Style: Inserts styles (CSS) details to the web page.

• Title: Provides a title to the web page.


10. What are the most commonly used List tags?

The list tags are used to list out any information. There are types in listing out the information using the tags, these are:

• Ordered List: Used as


and provides the list in a numbered format.

• Unordered List: Used as


and provides the list in a bullet format.

NOTE: both the above use list item tags ie

  • ...

in them


• Definition List: Used as


which provides a list in it and takes Definition Term (ie...) and a detailed definition (ie...).


11. What is the best way to group form elements?


tag can be used to group some of the form elements. When the purpose is to provide some HTML elements as a group to the user then, fieldset tag is the best one to use. It takes another tag in it which provides a title to the grouped elements.


12. List few input type attributes that are new in HTML5.

An input tag can take some attributes based on the requirement. ie creates a textbox that takes text/number/special characters into it. The attribute type can take more values, these are:

• Datetime: Gives a datetime accepted textbox.

• Placeholder: Places an editable text in the textbox.

• Number: Takes only numbers and no text and special characters.

• Tel: Takes inputs like a telephone number.

• Email: Takes text with email format.


13. How is it possible to insert a copyright symbol in a web page?

As there is no direct key to type and insert the copyright symbol in a web page, it has to be given by combining different characters. This can be done in multiple ways like:

• &copy.

• & #169.


14. What is a hyperlink?

A hyperlink is a text/image on a webpage, which when clicked redirects to a new webpage.


15. Explain the type and value attributes for a list item (ie

  • ).


The type attribute helps to change the listing/numbering of the list items. It is also used to change the numbering index the value attribute is used.


16. Describe the way in which color can be applied to an element in an HTML page.

HTML elements can be colored in three ways:

• Color name ie red/blue etc.

• Hex Colorie #efefef, and

• RGB(10,234,128) which is a combination of red, green, blue.


17. Explain the two web storage in HTML5.

In HTML 5 data storage can be done in two ways:

• Session Storage: The current session (i.e., a user who is browsing the website) details are stored. Once the user closes the browser, the storage is cleared.

• Local Storage: Data stored in local storage will not be cleared automatically or when the user closes the browser.


18. Explain Graphics in HTML5.

HTML5 has two types of providing graphics, SVG and Canvas. SVG is helpful when using devices like tablets, iPads etc. Whereas, Canvas is an area in the document or HTML page where graphics can be drawn.


19. What are the Server-Sent Events (SSE)?

The events that come from the server to the browser are termed as Server Side Events.


20. List out the new attributes provided in HTML5 for the form tag.

HTML5 has introduced two new attributes for the form tag which are:

• autocomplete.

• non-validate.


21. What is the usage of a novalidate attribute for the form tag that is introduced in HTML5?

The form attribute novalidate is a Boolean type which takes true/false values. If disabled or made false, the form data is not validated when submitted.


22. Why do we need to autocomplete attribute for the form tag?

The autocomplete attribute is usually applied to text boxes with which the user can fill the textboxes with the previous values given to it.


23. How can you hide  HTML source code?

It is not possible to hide the HTML source code as the browser needs to understand the code.


24. How can a static HTML page redirect the visited a new page?

The meta tag has an attribute called URL which takes you to a redirected link.


25. What is Cell Padding?

Cell Padding refers to the space between the cell wall and cell border.


26. What are the different kinds of Doctypes available?

The three kinds of Doctypes which are available:

• Strict Doctype

• Transitional Doctype

• Frameset Doctype


27. How do we comment HTML code in an HTML page?

HTML code can be commented using


28. List the API’s available in HTML5.

The available API’s in HTML are:

• DOM Level 1

• DOM Level 2 Core

• DOM Level 2 HTML

• DOM Level 3


29. Explain Application Cache.

Application Cache is a mechanism in which the web applications can also run offline. One of the advantages of using the application cache is that the resources load faster.


30. When do we use a meter tag?

This tag is also known as a gauge and is used to define a scalar measurement which is in a known range.


31. What is the usage of the cite tag?

The cite tag is used to represent the title of a work (like a book, paper, poem etc). This tag is mostly used as an inline tag.


32. What is a contenteditable attribute?

This attribute is a new feature in HTML5 using which any element can be edited directly from the browser.


33. How are Web Workers APIs used in HTML5?

Using Web Workers APIs provide a way to run something in the background with which certain tasks can be performed without distracting the user interface.


34. What is MathML in HTML5?

MathML stands for Mathematical Markup Language and is used to show mathematical and scientific content on the web page. This expression should be inserted in a math tag.


35. Explain WHATWG.

WHATWG stands for Web HyperText Application Technology Working Group which is an organization that develops and also maintains the HTML and API for web applications.


36. Explain Microdata in HTML5.

Using Microdata, the metadata is nested within existing content on web pages. Search engines extract the microdata from a web page to provide a good browsing experience.


37. List some of the formatting elements in HTML5.

HTML5 holds some new and old formatting elements, all together here is the list:

• Marked text

• Emphasized text

• Subscripts

• Superscripts

• Small text

• Deleted text

• Inserted text


38. What is the difference between HTML and XHTML?

HTML stands for HyperTextMarkup Language and XHTML stands for eXtensibleHyperTextMarkup Language which is defined in XML format.


39. What is an API in HTML5?

API stands for Application Programming Interfaces and is a way to create applications. They use pre-built components. Using the available APIs, developers can integrate the features into their websites.


40. List the API’s available in HTML5.

The HTML5 standard introduced a number of new APIs. Here is a small list:

• Constraint Validation API

• Text Track API

• Media API

• Command API

• User Interaction

• Data Transfer API

• History API

• Application Cache API


41. What is a manifest file in HTML?

With the introduction of application cache, a web application is accessible without an internet connection. Every page of the web application should hold the manifest attribute to get cached.


42. What is the difference between the font size units em and rem?

By default, the font size in a browser is 16px and can be increased or decreased in the browser settings. 1em equals the font-size given in the browser. Whereas, the rem value depends on root element that is HTML tag.


43. What are the two methods that are used in form elements action attribute?

A form has an action attribute that takes two values, Post and Get (default). The Post method is used to submit (insert\update\delete) data whereas, Get method is used to get some data.


44. What is Web SQL?

HTML5 has introduced a database connection to store values on the client side. Web SQL is such a database in the browser which holds client information. It is important to note that Web SQL does not store critical data (like passwords) in it.


45. What are the minimum number of HTML tags are required to create an HTML page?


A minimum of 3 tags (HTML, head, and body) are required to create a working HTML page.



Didn't find what you are looking for?  Contact Us