PEMROGRAMAN WEB

HTML
by wiwin andriana
HTML Introduction
• HTML is the standard markup language for creating Web pages.
• What is HTML?
• HTML stands for Hyper Text Markup Language
• HTML is the standard markup language for creating Web pages
• HTML describes the structure of a Web page
• HTML consists of a series of elements
• HTML elements tell the browser how to display the content
• HTML elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a
link", etc.

Start tag Element content End tag

<h1> My First Heading </h1>
<p> My first paragraph. </p>
<br> none none
HTML Page Structure
HTML Editors
• Learn HTML Using Notepad or TextEdit

– Step 1: Open Notepad (PC)

– Step 2: Write Some HTML

– Step 3: Save the HTML Page

– Step 4: View the HTML Page in Your Browser

HTML Basic, Elements, Attributes

• <h1>This is heading 1</h1>

• <p>This is a paragraph.</p>

• <p style="color:red;">This is a red paragraph.</p>

• <a href="https://www.w3schools.com">This is a link</a>

• <img src="w3schools.jpg" alt="W3Schools.com" width="104"

height="142">
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

• <h1 style="font-size:60px;">Heading 1</h1> (Bigger Headings)

HTML Headings
HTML Paragraphs
• HTML Display
• HTML Horizontal Rules
• HTML Line Breaks
– <p>This is<br>a paragraph<br>with line
breaks.</p>

• The Poem Problem

• <pre> Element
HTML Styles

The HTML Style Attribute

<tagname style="property:value;">

 Background Color
 Text Color
 Fonts
 Text Size
 Text Alignment
 Background Color
 Text Color
 Fonts
 Text Size
 Text Alignment
HTML Quotation
and Citation
Elements
HTML
Comments
HTML Colors
 Background Color
 Text Color
 Border Color
 Color Values
HTML Links
<a href="url">link text</a>

 Absolute URLs vs. Relative URLs

 HTML Links - Use an Image as a
Link
 Link to an Email Address
 Button as a Link
 Link Titles
 More on Absolute URLs and
Relative URLs
HTML Images
HTML Tables
HTML Lists
 Unordered HTML List
 Ordered HTML List
 HTML Description Lists