HTML Basics - PowerPoint PPT Presentation


PPT – HTML Basics PowerPoint presentation | free to download - id: 7bac08-ZTgxO


The Adobe Flash plugin is needed to view this content

Get the plugin now

View by Category
About This Presentation

HTML Basics


HTML Basics What is HTML? Basic Tags Fonts Colors Pictures Links Lists Tables Frames Good Sites What is HTML? HTML is a programming language that allows you to tell ... – PowerPoint PPT presentation

Number of Views:32
Avg rating:3.0/5.0
Slides: 22
Provided by: its1264
Learn more at:
Tags: html | basics | number


Write a Comment
User Comments (0)
Transcript and Presenter's Notes

Title: HTML Basics

HTML Basics
  • What is HTML?
  • Basic Tags
  • Fonts
  • Colors
  • Pictures
  • Links
  • Lists
  • Tables
  • Frames
  • Good Sites

What is HTML?
  • HTML is a programming language that allows you
    to tell the browser what you want it to display
    and how you want it to be displayed, in simple
    terms, it is a WebPage. In HTML there are certain
    markers, like commands,
  • that tell the Browser what to do, these are
    called tags. By using tags you can have tables,
    fonts, colors, pictures, links, and almost
    anything you can think up, and experimentation
    with tags can lead to some pretty cool WebPages.

Important Things to Remember...
  • Use Notepad, Microsoft Word adds programming
    unless you save it as text only without
  • Be sure to save it as a .htm or .html file, not a
    .txt file or it will not show in you browser
  • Carriage returns are not present in HTML, for a
    return, use a ltbrgt tag
  • Remember use end tags
  • If it isnt right, check your spelling...
  • Put things that arent part of the tag, but
    inside the tag in ltfont size7gt
    not ltfont size7gt
  • Make sure to encase all of your tags with a lt and
    the beginning and a gt at the end.

Basic HTML Tags
These are only the tags that are essential to
begin a page, there are many other tags. The
next slide shows where these tags belong, and how
they are used.
Basic Tags In Place
lthtmlgt ltheadgtlttitlegtName of Pagelt/titlegtlt/headgt ltb
odygt Content of Page lt/bodygt lt/htmlgt
It looks Like
Name of Page
Content of Page
Basic Font Changes
  • To enter Text into your page, you can simply
    type after the body tag, however, sometimes
    change is good. All changes to your font size,
    color, face and style, will occur inside the
    ltfontgt tag.

Examples of Font Change
  • Adding colors to WebPages is not difficult. As
    a matter of fact, it is quite easy. In HTML you
    can either put in the basic names of the colors
    (like red, blue, green, etc.) or you can enter in
    a numerical code for color. In this code
    (hexadecimal code) the first two numbers are the
    amounts of red displayed, the second two numbers
    are the amount of green displayed, and the third
    two numbers are the amount of blue displayed,
    these colors range from 0-f. ffffff is black
    and oooooo is white, and so on, when using these
    numbers be sure to use quotations and a number
    symbol like 556600. A table of all these
    color numbers can be viewed at http//wdvl.interne

Basic Color Tags
  • To add pictures first be sure that they are in
    an acceptable format, these are gifs and jpgs.
    Any other formats like bmps, will not show up!
    If you use to many animated gifs, you page can be
    referred to as annoying, and you should avoid
    this. You can add pictures to many places, but
    the format is always the same, except in adding
    it as a background. The format for inside the
    body is ltimg srclocation of picture.gifgt or
    ltimg srclocation of picture.jpggt. For the
    background, inside the ltbody put ltbody
    backgroundlocation of picture.gifgt

Picture Tags
  • Links can be added to other WebPages, or to
    other pages within your WebPage. Also you can
    add links to other objects inside your homepage
    or any other page. To add a link to another
    WebPage type lta hrefhttp//site namegtName of
    Sitelt/agt To add a link to a page inside your
    WebPage type lta hrefpagename.htmlgtName of
    Pagelt/agt To add a link withing a page typelta
    hrefname of placegtName of placelt/agt then
    where you want the link to go, inside the tag put
    ltidname of placegt, so if you wanted to link to
    a table you would put lttable idname of placegt.
    If you want to return to the previous page, just
    put a link to the other page on the page you
    linked to.

  • Lists can add a lot to a WebPage, there are
    different types of lists and different types of
    bullets or numbers that can be used. You can
    have an ordered list (a, b, c, etc.) unordered
    lists (with bullets) or you can have definition
    lists. An Ordered List looks like a) list item
  • b) list item and so on
  • An Undordered List looks like
  • list item
  • list item
  • An Definition List looks like
  • Term
  • Definition

Ordered Lists
Unordered Lists
Definition Lists
  • Tables in HTML are easy to program if you know
    what you are trying to do. Tables look like the
    charts present on many of these slides. Tables
    in browsers by default have no borders, if you
    want to see the edges of your table, you have to
    place a border command inside the table tag. You
    can also use tables to format pages. Inside
    tables, the text is always the default of the
    browser (black and small), if you want to change
    this font, you must add a ltfont colorcolor
    and/or sizexgt inside each cell to make the

Table Tags
  • Frames are what allow you to format your pages
    into rows and columns. In my WebPage, I have
    used frames, I have two frames, and the column is
    a frame. Frames are not visible on all browsers
    and are hard to explain. My experiences online
    have led me to a site which will help you do
    frames in your WebPage. The site is

Good Sites
  • Basic Help http//
  • Browser Safe Colors http//
  • Frame Help http//
  • Pictures/Clip Art http//
  • I hope that my page/PowerPoint presentation had
    helped you to build your WebPage. If it has or
    has not and you would like to contact me, you can
    email me your comments or questions at

Extra Formatting Tags