0% found this document useful (0 votes)
10 views13 pages

HTML & CSS Basics for Web Development

The document provides an overview of HTML and CSS, detailing their definitions, importance, and various components such as tags, lists, and the CSS box model. It explains the differences between inline, internal, and external CSS, as well as the significance of semantic HTML elements for SEO and accessibility. Additionally, it includes information on HTML comments, class selectors, and the HTML declaration for rendering standards.

Uploaded by

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

HTML & CSS Basics for Web Development

The document provides an overview of HTML and CSS, detailing their definitions, importance, and various components such as tags, lists, and the CSS box model. It explains the differences between inline, internal, and external CSS, as well as the significance of semantic HTML elements for SEO and accessibility. Additionally, it includes information on HTML comments, class selectors, and the HTML declaration for rendering standards.

Uploaded by

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

New Generation University

Internet Application
Programming
Assignment: HTML and CSS

Deadline: 06/DEC/2025
1. What is HTML and why is it important?

Definition Importance

HTML stands for HyperText Markup Skeleton of the Web: It provides the

Language. foundational structure for all websites.


It is the standard markup language used
Accessibility: Semantic HTML helps
to create the structure and content of web
screen readers interpret content
pages.
correctly.
Cross-Platform: It is understood by all
web browsers and devices globally.
2. HTML Tags & The

HTML Tags

Tags are keywords enclosed in angle brackets, like


. They normally come in pairs: a start tag and an
end tag.
Purpose of

The element is a container for metadata (data


about data). It is placed between the tag and the

Ittag.
contains the title, links to stylesheets (CSS),
scripts, and other meta information that is not
displayed directly on the page.
3. Different Types of CSS

Inline CSS Internal CSS External CSS

Defined within the HTML Defined within the </div> Defined in a separate .css
element itself using the element, inside the section file and linked using the
style attribute. of an HTML page. element. Best for
style maintenance.
4. Adding Comments in HTML & CSS

CSS Comments
HTML Comments
CSS comments are used to explain the code, and
HTML comments are not displayed in the browser,
may help when you edit the source code later.
but they can help document your source code.
/* This is a CSS comment */
5. Making Lists in HTML

There are two main types of lists in HTML:

1. Unordered List ()

Starts with the tag. Each list item starts with the
tag. The list items will be marked with bullets.

2. Ordered List ()

Starts with the tag. Each list item starts with the
tag. The list items will be marked with numbers.
6. Block-level vs. Inline Elements

Block-level Elements

Always start on a new line and take up the full


width available.

Examples: , , ,

Inline Elements

Do not start on a new line and only take up as


much width as necessary.

Examples: , ,
7. Semantic HTML Elements

What are they?

A semantic element clearly describes its meaning


to both the browser and the developer. Non-
semantic elements like tell us nothing about their
Why are
content. they important?

SEO: Search engines understand content


better.
Accessibility: Assists screen readers.

Code Readability: Easier for humans to


understand structure.
8. The Declaration

Purpose

It is an instruction to the web browser


about what version of HTML the page is
written in.

The declaration specifically tells the


browser to render the page as HTML5.

It ensures the browser renders the content


in "Standards Mode" rather than "Quirks
Mode".
9. CSS Class Selector

Purpose

The class selector selects HTML elements with a Example


specific class attribute.
/* CSS */
.center
It allows you to define styles for multiple text-align
color
elements across the page, making it reusable.

Symbol class
class

To select elements with a specific class, write a


period (.) character, followed by the class name.
10. The CSS Box Model

All HTML elements can be considered as boxes.


The CSS Box Model consists of:

Content: The content of the box, where text


and images appear.
Padding: Clears an area around the content.
The padding is transparent.
Border: A border that goes around the
padding and content.
Margin: Clears an area outside the border. The
margin is transparent.
Thank
You!
Internet Application Programming (HTML
& CSS)
Questions?
Image Sources

[Link]

Source: [Link]

[Link]

Source: [Link]

[Link]

Source: [Link]

[Link]

Source: [Link]

[Link]

Source: [Link]

[Link]
[Link]

Source: [Link]

You might also like