Scribd
Upload
174 views

Intro HTML Css Preso

Uploaded by

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

Intro HTML Css Preso

Uploaded by

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

INTRODUCTION TO HTML AND CSS

LEARNING THE LANGUAGE OF THE WEB

© 2012 Adobe Systems Incorporated. All Rights Reserved.


What is HTML?

 HTML stands for:


 Hypertext
 Markup
 Language

 A markup language, HTML


elements are the building
blocks of web pages.
 HTML elements use tags to
structure content.

© 2012 Adobe Systems Incorporated. All Rights Reserved. 2


Tags

 HTML elements consist of tags.


<html>
 Tags are enclosed by angle
brackets, like this: <html> <head>

 Tags usually come in pairs, like <title></title>


this: <title> and </title>
</head>
 Tags have a start (or opening)
and end (or closing). <body>

 Tags are not displayed in a <h1></h1>


web browser. <p></p>
 Tags interpret how to display </body>
content between the tags.
</html>

© 2012 Adobe Systems Incorporated. All Rights Reserved. 3


Tags

 <html></html> describes the web page.


 <head></head> describes the header.
 <body></body> describes visible page content.
 Common formatting tags:
 <h1></h1> displays a heading, ranging from size 1 (biggest) to 6 (smallest).
 <p></p> formats text as a paragraph.
 <strong></strong> bolds text.
 <em></em> emphasizes text, displays as italics.
 <br> creates a line break.
 Links:
 <a href="http://www.example.com"></a> creates a link to a web page.

© 2012 Adobe Systems Incorporated. All Rights Reserved. 4


CSS

 CSS stands for:


 Cascading
 Style
 Sheets

 Describes the “look and feel” of


HTML elements on a web page.
 Helps separate document
content (HTML) from document
presentation (CSS).
 Structures presentation
elements such as layout, colors,
and fonts.

© 2012 Adobe Systems Incorporated. All Rights Reserved. 5


CSS

 A style sheet contains a list of rules about how elements appear on a


page.
 Consists of a selector and a declaration block:
 Selectors tell which markup elements the style applies to.
 A declaration block is a list of property and value pairs that define the style.
 Can be embedded inside the HTML or linked as a separate document.
h1 {
font-family: Verdana, Geneva, sans-serif;
font-size: 24px;
font-weight: bold;
text-transform: uppercase;
color: #C00;
}

© 2012 Adobe Systems Incorporated. All Rights Reserved. 6


Evolution of HTML and CSS

 HTML and CSS are a collection of web


standards.
 HTML and CSS are a set of best practices for
building websites.
 HTML and CSS are constantly evolving:
 HTML5 is the fifth iteration of HTML and adds
tags to support multimedia elements and
dynamic graphics in modern web browsers.
 CSS3 defines a new set of modular rules for how
HTML content will be presented within the web
browser.

© 2012 Adobe Systems Incorporated. All Rights Reserved. 7


HTML5 best practices

 Use HTML5 <!doctype html> to tell a browser how to translate.


 Use <meta charset="utf-8"> to tell a browser the character-set.
 Use semantic markup tags <article>, <section>, <header>,
<nav>, and others to bring a higher level of structural meaning to
documents.
 Design and test content across a range of browsers and devices that
support HTML5 capabilities.

© 2012 Adobe Systems Incorporated. All Rights Reserved. 8

You might also like