Your Federal Quarterly Tax Payments are due April 15th Get Help Now >>

intro_to_html by bdmantra

VIEWS: 1 PAGES: 15

									1
                        Contents
   Getting Started..
   What is HTML?
   How to create and View an HTML document?
   Basic HTML Document Format
   The HTML Basic tags




                                               2
What the following term mean:
   Web  server: a system on the internet containg one
    or more web site
   Web site: a collection of one or more web pages
   Web pages: single disk file with a single file name
   Home pages: first page in website

Think about the followings before working
  your Web pages.
   Think about the sort of information(content) you
    want to put on the Web.
   Set the goals for the Web site.
   Organize your content into main topics.
   Come up with a general structure for pages and
    topics.
What is HTML?
   Tellingthe browser what to do, and what props to use.
   A serises of tags that are integrated into a text
    document.


  Tags are ;
   surrounded with angle brackets like this
       <B> or <I>.
   Most   tags come in pairs
       exceptions: <P>, <br>, <li> tags …
   The   first tag turns the action on, and the second turns
    it off.


                                                            4
   The second tag(off switch) starts with a forward slash.
       For example ,<B> text </B>

   can embedded, for instance, to do this:
       <HEAD><TITLE> Your text </HEAD></TITLE> it won't work.
       The correct order is <HEAD><TITLE> Your text </TITLE></HEAD>

   not case sensitivity.
   Many tags have attributes.
       For example, <P ALIGN=CENTER> centers the paragraph following it.

   Some browsers don't support the some tags and some
    attributes.




                                                                            5
               Basic HTML Document Format




<HTML>                   See what it
<HEAD>                   looks like:
<TITLE>WENT'99</TITLE>
</HEAD>
<BODY>
  Went'99
</BODY>
</HTML>




                                            6
How to Create and View an HTML document?
  1.Use an text editor such as Editpad to write the
    document.
  2.Save the file as filename.html on a PC. This is called
    the Document Source.
  3.Open Netscape (or any browser) Off-Line
  4.Switch to Netscape
  5.Click on File, Open File and select the filename.html
    document that you just created.
  6.Your HTML page should now appear just like any
    other Web page in Netscape.




                                                             7
7.You may now switch back and forth between the
  Source and the HTML Document
   switch to Notepad with the Document Source
   make changes
   save the document again
   switch back to Netscape
   click on RELOAD and view the new HTML
    Document
   switch to Notepad with the Document Source......




                                                       8
    Tags   in head
   <HEAD>...</HEAD>-- contains information about
    the document
    <TITLE>...</TITLE>-- puts text on the browser's
    title bar.




                                                       9
    Tags   in Body
   Let's talk Text
     Heading: <H1> </H1>
     Center:<Center> </Center>
     Line Break <P> ,<Br>
     Phrase Markups: <I></I> ,<B></B>



   Create a List
     Unordered list : <UL><li>
     Ordered list: <OL><li>
     Nested




                                         10
   Add Images
     Use  <IMG SRC=imagefilename> tags
     How to specify Relative pathnames
     Attributes of IMG tag
      -width,height
      -Alt
      -Align
      -<Img src=my.gif width=50 height=50 align=right
       alt=“My image”>




                                                        11
   Add some Link
     Use <A href=filename|URL></a>tags
     How to specify Relative pathnames
     Kinds of URLs
      -http://www.women.or.kr
      - ftp://ftp.foo.com/home/foo
      - gopher://gopher.myhost.com/
      - news://news.nuri.net
      - mailto:skrhee@women.or.kr




                                          12
   How to make colors changes?
     Hexadecimal number :
     Color names : <Font color=white>
     Changing the Background color
      <BODY BGCOLOR=#19378a>
     Changing Text color
     <BODY BGCOLOR=#19378a TEXT=#ffffff LINK=#ffff66
    VLINK=#66ffff>
     Spot   color
    <FONT COLOR=#66ffcc>WENT'99</FONT>
     Image   Background
    <BODY BACKGROUND=bgimg.gif >



                                                       13
How to specify Relative pathnames
   The current HTML document is my.html and the current directory is Iam

      C:\- Iam -my.html
                -your.html
           Type this ; <A href=your.html>Your link </A>

      C:\- Iam -my.html
                Child -your.html
           Type this ; <A href=Child/your.html>Your link </A>

      C:\-  Iam -my.html
            Sister -your.html
           Type this ; <A href=../Sister/your.html>Your link </A>

      C:\-  Mother -your.html
                Iam -my.html
          Type this ; <A href=../your.html>Your link </A>       Go to
      Back



                                                                          14
How to specify Relative pathnames
The HTML document is my.html and the image file is dragonfly.gif
 C:\-  Iam -my.html              ☞ Type this ; <IMG SRC=dragonfly.gif>
           -dragonfly.gif

 C:\-  Iam -my.html              ☞ Type this ; <IMG
   SRC=Image/dragonfly.gif>
        Image
            -dragonfly.gif

 C:\-  Iam -my.html              ☞ Type this ; <IMG
   SRC=../Image/dragonfly.gif>
      Image
           -dragonfly.gif

    C:\-  Image -dragonfly.gif    ☞ Type this ; <IMG SRC=../dragonfly.gif>
           Iam
             -my.html
                                                                  Go to Back



                                                                              15

								
To top