Scribd
Upload
47 views2 pages

HTML & CSS Basics

HTML and CSS are essential technologies for web development, with HTML providing structure and CSS controlling layout and appearance. The document covers basic HTML structure, key tags, types of CSS, and basic properties, along with an introduction to responsive web design. Learning these technologies enables the creation of visually appealing and functional web pages.

Uploaded by

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

HTML & CSS Basics

HTML and CSS are essential technologies for web development, with HTML providing structure and CSS controlling layout and appearance. The document covers basic HTML structure, key tags, types of CSS, and basic properties, along with an introduction to responsive web design. Learning these technologies enables the creation of visually appealing and functional web pages.

Uploaded by

raghad mustafa
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as ODT, PDF, TXT or read online on Scribd
You are on page 1/ 2

HTML & CSS Basics: A Beginner's Guide

Introduction to HTML & CSS HTML (HyperText Markup Language) and CSS (Cascading Style
Sheets) are the fundamental technologies for building web pages. HTML provides the structure,
while CSS controls the layout and appearance.

Why Learn HTML & CSS?


• They are essential for web development.
• HTML structures the content of web pages.
• CSS styles and enhances the visual presentation.
• They are easy to learn and widely used in the industry.

Basic HTML Structure An HTML document consists of elements enclosed in tags.


<!DOCTYPE html>
<html>
<head>
<title>My First Web Page</title>
</head>
<body>
<h1>Welcome to HTML</h1>
<p>This is a paragraph.</p>
</body>
</html>

Key HTML Tags:


• <h1> to <h6> - Headings
• <p> - Paragraphs
• <a> - Links
• <img> - Images
• <ul>, <ol>, <li> - Lists
• <div> - Division for layout

Introduction to CSS CSS is used to style HTML elements. There are three types of CSS:
1. Inline CSS - Applied directly to an element.
<p style="color: blue;">This is blue text.</p>

2. Internal CSS - Written inside a <style> tag in the <head> section.


<style>
p { color: red; }
</style>

3. External CSS - Stored in a separate file (style.css) and linked to HTML.


body {
background-color: lightgray;
}
<link rel="stylesheet" href="style.css">

Basic CSS Properties


• color - Sets text color
• font-size - Defines text size
• background-color - Sets background color
• margin & padding - Controls spacing
• border - Adds a border around elements

Example:
h1 {
color: blue;
font-size: 24px;
text-align: center;
}

Responsive Web Design To make a webpage responsive, use CSS media queries:
@media (max-width: 600px) {
body {
background-color: yellow;
}
}

Conclusion HTML and CSS are the building blocks of web development. By learning these
technologies, you can create beautiful and functional web pages. Start experimenting and happy
coding!

You might also like