Free CSS Courses

CSS stands for Cascading Style Sheets and is a styling language used to style HTML documents. It describes how HTML elements should look like on web pages. It was developed by the World Wide Web Consortium (W3C) in 1996. It was developed to present the HTML document in a user-attractive way.

CSS saves a lot of time invested in describing the elements through HTML, thereby reducing the work. It controls the multiple-page layout all at once. The styling modifications can be done easily. No style can be done using DIV elements to different group sections of an HTML page. CSS stores external stylesheets. CSS files can be stored with .css extension.

CSS follows a specific syntax: Selector Declaration Declaration. Example, h1 {color:blue; font-size: 15px;}. Selector points to the Element of the HTML document that the user wants to style.

Declarations are separated by semicolons when there is more than one declaration in a block. Every declaration has a CSS property name and a value, both separated by a colon. Declaration blocks are described within curly braces. Multiple CSS declarations are separated by semicolons. Here h1 is the selector, color and size are properties, and blue and 15px are its values. 

CSS selector is used to find or selecting the element you want to style. CSS selectors are divided into 5 categories. They are:

• Simple selectors: they select elements based on name, id, and class. 

• Combinator selectors: they select elements based on the specific relationship between them. 

• Pseudo-class selectors: They select elements based on certain states. 

• Pseudo-element selectors: They select and style a specific part of an element.

• Attribute selectors: They select elements based on a particular attribute or its value.

CSS comments are used to explain the code. It helps the user to edit the source code at a later stage. CSS comments are not displayed on the web browser, but it is used to document the source code. Comments are usually ignored by browsers. CSS comments are described under <style> element and they start with */ and ends with /*. Users can add comments wherever they want in the code. Comments are descriptive. 

Other CSS Elements Include :

• Color

• Background

• Border

• Margin

• Padding

• Height/Width

• Box model

• Outline

• Text

• Font

• Icons

• Links

• Lists

• Tables 

• Display

• Max-width

• Position

• Overflow

Advanced Features of CSS:

• Rounded corners

• Rounded border images

• Background

• Color keyword

• Gradients

• Shadows

• 3D transforms and others

CSS can be categorized into 3 types:

Inline CSS: Inline CSS has the CSS property in the body section that is attached along with the element. Inline CSS is specified within an HTML tag using the style attribute. 

• External CSS: External CSS contains a separate CSS file. It contains only style property with tag attributes like class, id, heading. This file has to be linked to the HTML document using the link tag. Style can be set only once for each element, and it will be applied across the web pages. These files are saved with the .css extension.

• Embedded CSS: Embedded CSS is also known as internal CSS. It is used when a single HTML document should be styled uniquely. A CSS rule-set is given within the HTML file in the head section (CSS is embedded within the HTML file. 

The CSS courses offered by Great Learning will help you learn CSS for free. You will be able to style and design HTML documents in a very sophisticated and attractive way. This free course will help you learn CSS from its basics like its syntax, attributes to advanced features like color keywords, gradients, etc. It will help front-end developers to style their web pages in a better way and also help students to work with their projects. You will earn a certificate for the CSS course after the successful completion. You can also register for the free CSS tutorial to learn CSS in your free time. Happy learning!