0% found this document useful (0 votes)
6 views6 pages

Web Development (HTML& CSS) Module 6 - Properties and Values

The document provides an overview of CSS properties and their values, which define the appearance of HTML elements. It covers key aspects such as colors, font styling, text alignment, and spacing, emphasizing the importance of consistent styling for a cohesive design. Code examples illustrate how to implement these properties effectively.

Uploaded by

Chidinma
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
6 views6 pages

Web Development (HTML& CSS) Module 6 - Properties and Values

The document provides an overview of CSS properties and their values, which define the appearance of HTML elements. It covers key aspects such as colors, font styling, text alignment, and spacing, emphasizing the importance of consistent styling for a cohesive design. Code examples illustrate how to implement these properties effectively.

Uploaded by

Chidinma
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

WEB DEVELOPMENT

(HTML & CSS)

Module 6
Properties and Values
1
CSS Properties Overview

CSS properties define how HTML elements appear, including color, font, spacing, alignment,
and layout behavior. Understanding properties and their corresponding values allows
developers to create visually appealing and readable web pages.

2
Colors and Backgrounds

Colors and backgrounds enhance visual presentation and brand identity. CSS provides
multiple ways to define colors: named colors, hexadecimal, RGB, or HSL values.
Backgrounds can include solid colors, images, or gradients.

Code Example:
body {
background-color: #f4f4f4;
}
h1 {
color: #333;
}

3
Font Styling

Font properties such as font-family, font-size, font-weight, and line-height improve


readability and aesthetics. Choosing appropriate fonts ensures a professional appearance
and enhances user experience.

Code Example:
p{
font-family: Arial, sans-serif;
font-size: 16px;
line-height: 1.5;
}

4
Text Alignment And Spacing

Text alignment, letter spacing, word spacing, and line height control the flow and readability of
text. Proper spacing avoids clutter and enhances the visual balance of web content.

Code Example:
h2 {
text-align: center;
letter-spacing: 1px;
word-spacing: 2px;
}

5
Consistent Styling

Applying consistent property values across multiple elements maintains uniformity, creating
a cohesive design that enhances usability and professionalism.

Code Example:
button {
background-color: #0077cc;
color: white;
padding: 10px 20px;
border-radius: 5px;
}

You might also like