Content Of Presentation
Introduction
• Internet
• Getting to know HTML
• Structure of the web page
• Document Object Model
• Tags and Elements
• Getting to know CSS
• Applying CSS
• Selectors
How Does The
Internet Work?
What is HTML?
HTML = Hyper Text Markup Language
A markup language designed for the creation of web
pages and other information viewable in a browser.
The basic language used to write web pages
File extension: .htm, .html
Structure of the web page
<!Doctype html>
<html lang=“en”>
<head>
<title>JUS</title>
</head>
<body>
Hello, JUS
</body>
</html>
Document Object Model
<!Doctype html> html
<html lang=“en”>
<head>
<title>JUS</title> head body
</head>
<body>
Hello, JUS title Hello, JUS
</body>
</html>
JUS
HTML TAGS
HTML tags are the hidden keyword with in a web page that
define how the browser must format and display the content
most of these tags have 2parts opening tags and closing tags
container
<p>This is web designing course</p>
What is CSS?
• CSS= Cascading Style Sheets
CSS is a way to style HTML whereas HTML is
the Content, the style sheet is the presentation
of the document.
A Style
Selector Property Value
p { color: red; }
The property is followed by a colon (:) and the
value is followed by a semicolon (;)
Applying CSS
There are three ways to apply CSS to HTML
Inline
Affects only the element applied to.
Internal of Embedded
Affects only the elements in single file.
External
Linked to an unlimited number of files.
All CSS Simple Selectors
Selector Example Example Description
#id #firstname Selects the element with id="firstname"
.class .intro Selects all elements with class="intro"
element.class p.intro Selects only <p> elements with class="intro"
element p Selects all <p> elements
* * Selects all elements
HT
M
L
&
CS
S
So
f tw
ar
e's
ne
e de
d
Th
Pr e
og Jo
ra c k
m of
m
in
g
D!
EN
HE
T