HTML tutorial 1: tags and attributes


Hi everyone,

In this lesson I will show you what an attribute and a tag is.
You can also see this on my youtubechannel : http://youtu.be/S1mwaTAqsSg

What you should know:

  1. HTML stands for Hypertext Markup Language.
  2. I will work with textmate (because I have a mac), but you can work with notepad (it's almost the same and it's a standard program on your computer).
Type this: 


<html>
<head>
</head>
<body>
</body>
</html>

Safe this and change the extention to .html . A hompage is always index. So safe that as index.html
Open it with your browser.


This are your standard tags!
Everything between <> is called a tag.
A tag is closed with a /.

Everything between <head> and </head> are documents that are connect. It's possible to apply css code. I will explain this later.

Everything between <body> and </body> will you see on your site.

Now I will explain some basic tags.

Type this:

<html>
<head>
       <title>This is my firs webpage</title>
</head>
<body>
      <h1>Your Name</h1>
     <hr/>
      <p>This is my first webpage</p>
     <p>I'm so happy
     <br/>
      Beautiful website!!!
      </p>
</body>
</html>

Safe this and change the extention to .html . A hompage is always index. So safe that as index.html
Open it with your browser.

  • <title> is the name on your webpage (you can see this in your browser)
  • <h1> is for a title
  • The <p> tag is for begin a new paragraph
  • <hr/> is for a lign
  • <br/> is for whitespace
  • ...


This is a good website for all the tags: http://www.web-source.net/html_codes_chart.html

----------------------------------------------------------------------------------------------------------------------------------

Now I will explain you what is an attribute?
An attribute is everything after a tag.
For example <body bgcolor:"#00FF00"> bicolor... is an attribute.

Type this:

<html>
<head>
       <title>This is my firs webpage</title>
</head>
<body bgcolor:"#00FF00">
      <h1>Your Name</h1>
     <hr/>
      <p font:>This is my first webpage</p>
     <p><font face="Palatino Linotype, Book Antiqua, Palatino, serif" size="+6">I'm so happy</font>
     <br/>
      Beautiful website!!!
      </p>
</body>
</html>

Safe this and change the extention to .html . A hompage is always index. So safe that as index.html
Open it with your browser.


  • face = your font
  • size = your font size
  • bgcolor = background color
  • width
  • height
  • ...


This is a good website for all the attributes: http://www.w3.org/TR/html4/index/attributes.html

Geen opmerkingen:

Een reactie posten