Introduction to CSS -

Introduction to CSS

CSS, which stands for Cascading Style Sheets, is a style sheet language used to describe the presentation of a document written in a markup language such as HTML. It defines how HTML elements should be displayed on screen, paper, or in other media. While HTML structures the content of a web page, CSS provides the visual formatting and style.
CSS separates the content (HTML) from the presentation (styling), which allows for more efficient and flexible web design. With CSS, you can control the layout, typography, colors, and other visual aspects of a webpage, making it a powerful tool for web designers and developers.

In the below PDF we discuss about Introduction to CSS in detail in simple language, Hope this will help in better understanding.

The Basics of CSS:

Selectors: CSS uses selectors to target HTML elements that you want to style. Selectors can be HTML elements, classes, IDs, or other attributes. For example, you can target all <h1> elements, elements with a specific class (.header), or a unique element with an ID (#main-content).
Properties and Values: CSS rules consist of properties and values. Properties are the visual aspects you want to style, such as color, font-size, or margin. Values specify how you want the properties to be applied, like red, 16px, or 20px 10px.
Declaration Blocks: CSS rules are enclosed in declaration blocks, which are wrapped in curly braces {}. A CSS rule typically consists of a selector and a declaration block. Here’s a simple example:
```
h1 {

color: #336699;

font-size: 24px;

}
```
Cascade: CSS stands for “Cascading Style Sheets” because it allows you to apply multiple styles to the same element. The browser resolves conflicts through a process called the cascade, where the most specific rule takes precedence.
Inheritance: Some CSS properties are inherited from parent elements to their child elements. This means that styles applied to a parent element may also affect its children unless explicitly overridden.

Linking CSS to HTML:

To apply CSS styles to an HTML document, you need to link your CSS file to the HTML file using the <link> element in the document’s <head> section.

Here’s an example:

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<!-- Your HTML content here -->
</body>
</html>

In this example, the href attribute points to the CSS file, which contains the styling rules.