SoftTech

introduction to "Cascading Style Sheets"

Watch Tutorial

1. What is CSS?

CSS stands for Cascading Style Sheets. It is used to describe the presentation and design of web pages, allowing you to control the layout, colors, and fonts of your site independently from the content (HTML).

2. Basic Syntax

A CSS rule-set consists of a selector and a declaration block.

Selector: Points to the HTML element you want to style (e.g., h1, p).
Declaration: Contains a property (like color) and a value (like blue), separated by a colon and ending with a semicolon.

3. How to Add CSS to HTML

There are three primary ways to insert a stylesheet:

Inline CSS: Using the style attribute directly inside an HTML tag.
Internal CSS: Using a <style> element within the <head> section of an HTML document.
External CSS: Linking an external .css file using the <link> tag in the <head>. This is the most efficient method for managing large websites.

4. Key Benefits

Efficiency: You can change the look of an entire website by editing just one file.
Separation of Concerns: It keeps the structure (HTML) separate from the design (CSS), making the code cleaner and easier to maintain.
Device Compatibility: CSS allows for different layouts to be displayed on various screen sizes and devices.

Resources

Code Snippet

h1 {
  color: blue;
  font-size: 20px;
}

SofTech

CSS

introduction to "Cascading Style Sheets"

Watch Tutorial

Resources

Code Snippet