CSS - Cascading Style Sheets
What is CSS?
CSS is the language used to describe the presentation of a web page written in HTML. It controls the layout, colors, fonts, and overall appearance of elements on the screen.
Why Use CSS?
- Separation of content and design: Keeps HTML clean and focused on structure.
- Reusability: A single CSS file can style multiple pages.
- Consistency: Ensures a uniform look across all pages.
- Accessibility: Enhances readability and supports responsive design.
Types of CSS
- Inline CSS: Applied directly within HTML elements using the style attribute.
- Internal CSS: Defined within a <style> tag inside the HTML <head>.
- External CSS: Linked as a separate `.css` file using the <link> tag.
Common CSS Properties
- color: Text color
- background-color: Background color of an element
- font-size: Size of the text
- margin: Space outside an element
- padding: Space inside an element
- border: Outline around an element
- display: Layout behavior (block, inline, flex, etc.)
CSS Selectors
- Element selector: Targets all instances of an element (e.g., p, h1)
- Class selector: Targets elements with a specific class (e.g., .header)
- ID selector: Targets a specific element by ID (e.g., #main)
- Group selector: Targets multiple elements at once (e.g., h1, h2)
- Descendant selector: Targets elements inside another element (e.g., div p)
Responsive Design
CSS enables responsive web design using techniques like:
- Media Queries
- Flexible Grid Layouts
- Relative Units (%, em, rem)
Advantages of CSS
- Improves page load speed
- Supports animations and transitions
- Helps build mobile-friendly layouts
← Back to Home