Introduction
What is CSS?
CSS stands for Cascading Style Sheets. It is a language used to describe the style and layout of web pages — including design, colors, spacing, and fonts. CSS works alongside HTML to control the presentation of the content.
Benefits of Using CSS
- Separates content (HTML) from design (CSS)
- Makes websites look visually appealing
- Allows reusability of styles across multiple pages
- Improves page loading speed with external CSS
- Enables responsive web design
CSS Syntax and Selectors
CSS is written in rules. A rule consists of a selector and a declaration block. Example:
<style>
p {
color: red;
font-size: 18px;
}
</style>
<p>This is a styled paragraph.</p>
This is a styled paragraph.
Types of CSS
1. Inline CSS
CSS is written directly in the HTML tag using the style attribute.
<p style="color: blue;">This is blue text using inline CSS.</p>
This is blue text using inline CSS.
2. Internal CSS
CSS is written inside a <style> tag within the <head> of the HTML document.
<!DOCTYPE html>
<html>
<head>
<style>
h2 {
color: green;
}
</style>
</head>
<body>
<h2>Welcome to Internal CSS</h2>
</body>
</html>
Welcome to Internal CSS
3. External CSS
CSS is written in a separate file with .css extension and linked using the <link> tag.
style.css
body {
background-color: #f0f0f0;
font-family: Arial, sans-serif;
}
HTML File
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>This is styled using external CSS.</p>
</body>
</html>
How to Link CSS to HTML
To connect an external CSS file to your HTML document, use the <link> tag inside the <head> tag.
<head>
<link rel="stylesheet" href="styles.css">
</head>
If you have any questions, feel free to ask. Thank you for reading!
If you have any query or question, please contact through below form. Our team will be in touch with you soon.
Please provide your valueable feedback or suggession as well.