DEV Community

Sasireka
Sasireka

Posted on

CSS Basics

1. What is CSS?

  • CSS stands for Cascading Style Sheets is a stylesheet language used to design a web page.

  • There are three types of CSS:

Internal CSS - Style a single HTML element using the style attribute directly within the HTML tag.

External CSS - The <style> tag located in the <head> section of a single HTML document.

Inline CSS - The CSS code is written in a separate file with a .css extension and linked to the HTML document(s) using a <link> tag in the <head> section.

2. What is CSS Selectors?

  • CSS selectors are used to select the HTML elements to style.

  • There are five types of CSS Selectors:

Element Selector - The element selector selects HTML elements based on the element name.
p {
text-align: center;
color: red;
}

ID Selector - The id selector uses the id attribute of an HTML element to select a specific element.
#one {
text-align: center;
color: red;
}

Class Selector - The class selector selects HTML elements with a specific class attribute.
.center {
text-align: center;
color: red;
}

Universal Selector - The universal selector (*) selects all HTML elements on the page.
*{
text-align: center;
color: blue;
}

Grouping Selector- The grouping selector selects all the HTML elements with the same style definitions.
h1, h2, p {
text-align: center;
color: red;
}

3. Difference between Padding and Margin?

  • Padding creates space inside an element, between the content and the border

  • Margin creates space outside an element, between the border and other elements.

Resources : https://www.w3schools.com/css

Top comments (0)