HTML and CSS 101

Let's test your knowledge related to "element, tag, attribute, meta tags, headings, paragraph, pre and code" concepts in HTML.

This lesson will help you understand how to use links in a Web page.

This lesson will help you understand how to use image in a Web page.

This lesson will help you understand the important concept of inline and block level elements of Web page.

Let's test your knowledge related to "div, span, hyperlink, image, inline and block elements" concepts in HTML.

This lesson will help you understand how to create list in Web page.

This lesson will help you understand how to create table in Web page.

Let's test your knowledge related to "List and Table" concepts in HTML.

This lesson will help you understand how to use form in a Web page and its different input elements.

Let's test your knowledge related to "Form and input elements" concepts in HTML.

This lesson will help you understand how to use ID and Class in a Web page.

This lesson will help you understand what is Semantic tags and how to use in a Web page. 

Let's test your knowledge related to "ID, class and semantic tags" concepts in HTML.

Let's test your knowledge on "CSS introduction, types, comment, and CSS selectors" concepts from CSS.

This lesson will help you understand CSS font and its different properties and how to use them in a Web page.

Let's check your knowledge related to "Inspecting CSS, CSS colors and CSS fonts" from CSS.

This lesson will help you understand how to use Google fonts in a Web page.

This lesson will help you understand different types of units available in CSS and their usage. 

This lesson will help you understand the common text formatting ways available in CSS.

Let's test your knowledge on "Google fonts, CSS units and text formatting" concepts in CSS.

This lesson will help you understand the CSS box model which is one of the important concept in CSS. 

This lesson will help you understand how to style the Background like adding background color, image etc using CSS background property.

Let's test your knowledge on "CSS Box Model and CSS Background" concepts in CSS.

Let's check the knowledge on "CSS display property, CSS rounding corners and Box Shadow" concepts in CSS.

This lesson will help you understand how to add box shadow to an element using box-shadow property.

This lesson will help you understand the max width and auto margin concepts in CSS.

This lesson will help you understand the float and clear properties which are used in layout of the elements.

Let's check your knowledge on "CSS box shadow, max-width, margin auto, float and clear properties" concepts in CSS.

This lesson will help you build the basic image gallery using the float property.

This lesson will help you understand different states of a link and how we can style a link to create a button.

This lesson will help you understand the important CSS concepts like Pesudo classes and elements.

This lesson will help you understand the overflow property which controls what happens to the content when it overflows the element's boundry.

Let's check your knowledge on "Link states and button styling, Pseudo classes and elements and overflow property" concepts in CSS.

This lesson will help you understand how to style a menu bar like navigation or side bar.

This lesson will help you understand different ways of positioning element in the screen like absolute, relative, static etc. 

This lesson will help you understand the z-index property which is used to sets the z-order of a positioned element.

This lesson will help you understand the Specificity concept which is an algorithm used by browsers to determine the CSS declaration that will be applied to the element.

Let's check your knowledge on "CSS positioning, z-index and CSS specificity" concepts in CSS.

This lesson will help you understand the different flexbox container properties like flex-direction, flex-wrap, flex-flow, justify-content, align-items etc.

This lesson will help you understand the flexbox different item properties like order, flex-grow, flex-shrink, flex-basis, flex, align-self etc.

Let's check your knowledge on "CSS variables and CSS flexbox and its container and item properties" concepts in CSS.

This lesson will help you in building image gallery using flexbox layout.

This lesson will help you understand the animation perperty which is used to perform animation of element in a Web page.

This lesson will help you understand the CSS transition property which allows us to change property values over a given duration based on some event like mouse hover etc.

Let's check your knowledge on "CSS Animation and CSS Transition" concepts in CSS.

This lesson will help you understand the concept of CSS transform which allows us to move, rotate, scale and skew elements in a Web page.

This lesson will help you understand the concept of CSS media queries which allow us to apply CSS styles depending on device's type and help to build responsive Web pages.

Let's check your knowledge on "CSS Transform and CSS Media Queries" concepts in CSS.