0% found this document useful (0 votes)
52 views19 pages

Help Desk Final Project

HTML is the markup language used to structure and present content on the web. Key HTML elements include headings, paragraphs, line breaks, text formatting, links, images, and colors. HTML documents contain tags surrounded by angle brackets that provide semantic meaning and structure. Examples demonstrate how to write basic HTML code using common tags to display formatted text, images, and hyperlinks.

Uploaded by

mnzebby
Copyright
© Attribution Non-Commercial (BY-NC)
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
0% found this document useful (0 votes)
52 views19 pages

Help Desk Final Project

HTML is the markup language used to structure and present content on the web. Key HTML elements include headings, paragraphs, line breaks, text formatting, links, images, and colors. HTML documents contain tags surrounded by angle brackets that provide semantic meaning and structure. Examples demonstrate how to write basic HTML code using common tags to display formatted text, images, and hyperlinks.

Uploaded by

mnzebby
Copyright
© Attribution Non-Commercial (BY-NC)
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/ 19

Basic HTML for Website

Builders
What is HTML?

 HTML is the language used to describe


web pages.
 HTML stands for Hyper Text Markup
Language.
HTML Documents=Web Pages

 HTML contain plain text and HTML tags.


 A web browser is used to read HTML
documents and display them as web
pages.
Example

<html>
<body>
<p>This is my first paragraph</p>
</body>
</html>
 The <html> element defines the whole
HTML document.
Tags

 HTML tags are keywords surrounded by


angular brackets. (< >)
 Tags usually come in pairs.
Headings

 Headings are defined with the <h1> to <h6>


tags.
 <h1> defines the largest heading. <h6> defines the
smallest heading.
 Use HTML headings for headings only. Don’t
use them to make text big or bold.
 Search engines use your headings to index
the structure and content of your web
pages.
Example

<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
Paragraphs

 Paragraphs are defined with the <p> tag.


 Don’t forget the end tag! Forgetting the end
tag may lead to unexpected results and
errors.
Breaks

 Use the <br /> tag if you want a new line


without starting a new paragraph.
 The <br /> tag is an empty tag, which
means it doesn’t have an end tag.
Text Formatting

 HTML uses tags like <b> and <i> for


formatting output, like bold or italic text.
Styles

 Use style attributes as a common way to


style all HTML elements.
Example
<html>
<body style="background-
color:PowderBlue;">
<h1>Look! Styles and colors</h1>
<p style="font-
family:verdana;color:red">This text
is in Verdana and red</p><p
style="font-
family:times;color:green">This text
is in Times and green</p>
<p style="font-size:30px">This text is 30
pixels high</p>
</body>
</html>
Links

 In web terms, a hyperlink is a reference


to a resource on the web.
 Hyperlinks can point to any resource on the
web: an HTML page, an image, a sound
file, a movie, etc.
Example

<a href="url">Link text</a>


 <a href=”http://www.sctc.edu">Visit St. Cloud
Technical College!</a>

 The start tag contains attributes about


the link.
 The element content (Link text) defines
the part to be displayed.
Images
 In HTML, images are defined with the
<img> tag.
 To display an image on a page, you need
to use the src attribute. Src stands for
"source". The value of the src attribute is
the URL of the image you want to display
on your page.
 The URL points to the location where the
image is stored.
Example

<img src="boat.gif" alt="Big Boat" />


 The img src points to the URL
where the image is stored.
 The "alt" attribute tells the reader
what he or she is missing on a
page if the browser can't load
images.
Colors

 HTML colors are defined using a


hexadecimal (hex) notation for the
combination of Red, Green, and
Blue color values (RGB).
Web Safe Colors
 Some years ago, when
computers supported max
256 different colors, a list
of 216 "Web Safe Colors"
was suggested as a Web
standard.
 This is not as important
now, since most
computers can display
millions of different colors,
but here is the list to
demonstrate hex notation:
Putting It Together
Below is an example of an HTML document using most
of the tags we just learned.
<html>
<body style="background-color:#FFFF00">
<h1 style="text-align:center"> Look! A
heading! </h1>
<p style="font-family:courier new;
color:#FF0000; font-
size:20px"><big>This is a
paragraph.</big></p>
<p><b>Try your HTML skills out here:</b> <a
href="
http://www.w3schools.com/html/tryit.asp?
filename=tryhtml_styles ">Tryit Editor
v1.4</a></p>
</body>
</html>

You might also like