Mono_Pic Trust & Quality
English     Urdu

Learn 07، Introduction to CSS: colors, fonts, and style

Lesson 7: Introduction to CSS

Goal: Style your webpage.

Three Ways to Add CSS

html

<!-- 1. Inline (quick tests only) -->
<p style="color: red;">Red text</p>
 
<!-- 2. Internal (inside <head>) -->
<style>
    p { color: blue; }
</style>
 
<!-- 3. External (best practice) -->
<link rel="stylesheet" href="style.css">

Syntax

css

selector {
    property: value;
}

css

h1 {
    color: #1a5276;
    font-family: Arial, sans-serif;
    text-align: center;
}
 
.highlight {
    background-color: yellow;
}
 
#main-title {
    font-size: 32px;
}

Selector

Example

Targets

Tag

p

All paragraphs

Class

.highlight

Elements with class="highlight"

ID

#main-title

The one element with that id

Common properties: color, background-color, font-size, font-family, font-weight, text-align.

Practice: Create style.css and restyle your About Me page (colors, fonts, background).