Vaibhav Rathod's Notes

CSS

3 min read

History

- **How**:
	- Developed by **Håkon Wium Lie** and **Bert Bos** in **1994** at **W3C** (World Wide Web Consortium).
	- Designed to separate **content** (HTML) from **presentation** (layout and style), enabling web developers to control the look and feel of a webpage without affecting its structure.
	- CSS was developed to address the limitations of inline styles and to provide a way to style web pages in a flexible, reusable manner.
	- CSS has evolved over time with major versions and updates, with key milestones such as CSS2 (1998) introducing more sophisticated layout controls and CSS3 (2001–2010s) bringing powerful new features like animations, transitions, and responsive design.
-
- **Who**:
	- **Håkon Wium Lie**, a Norwegian web pioneer and the person behind the creation of CSS, working under Tim Berners-Lee at CERN.
	- **Bert Bos**, a Dutch computer scientist who co-developed CSS and played a significant role in its evolution at W3C.
	- **W3C** (World Wide Web Consortium), the organization that oversees the development and standardization of CSS, ensuring it works across browsers and platforms.
-
- **Why**:
	- To allow web developers to create more **dynamic**, **consistent**, and **maintainable** web designs by separating content (HTML) from its visual style (CSS).
	- To provide **flexibility** in styling web content, allowing for greater **accessibility**, **performance**, and **device compatibility**.
	- To **simplify** the management of website design by allowing styles to be applied globally, reducing redundancy and enabling the easy creation of **responsive** layouts for varying screen sizes and devices.

-

  • introduction

    • Advantages:

      • Separation of Structure and Design: CSS separates HTML content from styling, making the code cleaner and easier to maintain.
      • Responsive Design: Easily adapt layouts for different screen sizes using media queries.
      • Cross-Browser Compatibility: Works across all modern browsers with few exceptions.
      • Customization: Allows for extensive styling like animations, transitions, and flexible layouts.
      • Easy to Learn: Intuitive syntax, especially for those with HTML knowledge.

    • Disadvantages:

      • Cross-Browser Issues: Older browsers or versions may have compatibility problems.
      • No Logic: CSS lacks programming logic (no loops, conditions) and relies on JavaScript for dynamic behavior.
      • Hard to Scale: Managing large CSS files can be challenging without using frameworks or preprocessors.
      • Limited Layout Control: Older layout techniques (e.g., floats) are cumbersome; newer ones like Flexbox and Grid help, but can be tricky to master.
      • Performance Issues: Complex animations may cause performance problems, especially on lower-end devices.

    • Remember Points:

      • Preprocessors: Tools like SASS and LESS help manage large CSS codebases and offer advanced features like variables and mixins.
      • CSS Variables: Enables reusable values for easier theme customization and updates.
      • Advanced Layouts: CSS Grid and Flexbox allow for complex layouts without relying on JavaScript.

  • More Learn

Graph View

Backlinks