Scribd
Upload
171 views

Intro HTML Css Preso

Uploaded by

api-294086003
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
171 views

Intro HTML Css Preso

Uploaded by

api-294086003
Copyright
© © All Rights Reserved
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