Your SlideShare is downloading. ×
The Basics of (X)HTML Tags
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

The Basics of (X)HTML Tags

3,827
views

Published on

A quick overview of how to write (X)HTML. This just covers the basic syntax rules. More on using each specific tag later in the series.

A quick overview of how to write (X)HTML. This just covers the basic syntax rules. More on using each specific tag later in the series.

Published in: Technology, Design

0 Comments
9 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,827
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
423
Comments
0
Likes
9
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. The Basics of (X)HTML Tags Background photo by Will Pate
      • LearningNerd.com
      • LearningNerd.com
  • 2.
      • This is part of a series of (X)HTML and CSS tutorials, which can all be found at LearningNerd.com/xhtml-css
  • 3. Anatomy of an (X)HTML Tag
  • 4.
      • An (X)HTML tag is just a name/keyword surrounded by angle brackets.
      • So this is called the h1 tag .
      • Tag name
      • Angle brackets
      • < h1 >
  • 5.
      • It's good practice to write all HTML tags in lower-case letters.
      • And when using XHTML, all tags must be lower-case.
      • Good: <html>
      • Bad: <HTML>
  • 6.
      • Most (X)HTML tags are used in pairs to label content (such as text).
      • The closing tag always needs a slash before the tag name.
      • Opening tag
      • Closing Tag
      • <h1> content < / h1>
  • 7.
      • The opening tag, closing tag, and the content between them makes one unit called an (X)HTML element.
      • More specifically, this example can be called the h1 element .
      • <h1> content </h1>
      • (X)HTML Element
  • 8.
      • Just like those Russian stacking dolls, (X)HTML elements can nest inside of each other.
      • <p> here's a bunch of text with <q> a quote </q> in the middle of it </p>
    Photo by A30_Tsitika / Angélica
  • 9.
      • When nesting elements, the first tag opened must be the last tag closed.
      • Good:
      • <p> <q></q> </p>
      • Bad:
      • <p> <q> </p> </q>
  • 10.
      • Some (X)HTML tags insert content instead of labeling it. They're called empty or self-closing tags.
      • <hr>
      • In HTML, empty tags just look like opening tags.
      • <hr / >
      • In XHTML, empty tags have a slash .
      • (The space before the slash makes it compatible with old web browsers.)
  • 11. Attributes
  • 12.
      • Attributes just add extra information within an (X)HTML tag.
      • The value for an attribute can be inside either single or double quotes.
      • <h1 id =“ blah ”>
      • Attribute
      • Value
  • 13.
      • Tags can have multiple attributes, each separated by a space .
      • <h1 id=“blah” class=“big” >
      • content </h1>
      • Attributes always go inside the opening tag.
  • 14.
      • You'll learn how to use every specific attribute and tag later in this series.
      • Now that you know the basic rules for writing (X)HTML, the rest will be easy!
  • 15.
      • The next part of this series will cover the elements of an (X)HTML document.
      • If you have any questions, feel free to contact me through LearningNerd.com .