Scribd Logo
Upload

Welcome to Scribd!

  • 01 HTML Tag Mark-Up2011 SlideShow

    Uploaded by

    kmardock064
    123 views19 pages
    HTML stands for hyper text mark-up language. It is the basic set of rules that web browsers use to interpret and display Internet documents. HTML is used to mark up web pages.

    Original Description:

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    PPSX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    HTML stands for hyper text mark-up language. It is the basic set of rules that web browsers use to interpret and display Internet documents. HTML is used to mark up web pages.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PPSX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    123 views19 pages

    01 HTML Tag Mark-Up2011 SlideShow

    Uploaded by

    kmardock064
    HTML stands for hyper text mark-up language. It is the basic set of rules that web browsers use to interpret and display Internet documents. HTML is used to mark up web pages.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PPSX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 19

    HTML Tag Mark-Up

    How Tags are used to form your Web Page

    <html> What is HTML? </html>


    HTML stands for Hyper Text Mark-up Language It is the basic set of rules that web browsers use to interpret and display internet documents
    Tag Mark-up Sheet

    Elements
    Web Pages are made up of elements or distinct parts
    The Head
    Usually at the top of the page Can hold lots of non-display information like styles)

    The Title
    Found in the Head appears at the top of the window, in the colored bar

    The Body
    Where the text, pictures, tables, etc., that make up the page are located

    <head> Whats in Your Head? </head>


    The Head is where you put information about your page or things, like styles, that affect your page, but shouldnt be displayed.

    <!-- note tags --> can be used to enter text that will not be displayed
    <meta> information tags help identify specifics about your page that might help a search engine find your site

    Sample Page 1

    Tags
    Tags mark the beginning and end of a particular element. They (almost) always <b>bracket</b> the element <html>
    <head>
    <title> Tag Example</title> </head> <body> Here is the BODY</body> </html>

    Elements
    Elements are parts of the document that are distinguished by tags
    Closed Elemets have a beginning and end Everything between them is called the content of the element

    <html>

    <head>
    <title> Mark-Up Assignment</title> </head> <body> Here is the BODY</body> </html>

    Setting up Your Sheet


    <html> <head> <title> (your name here)s Mark Up Assignment</title> </head>

    <body>
    < < >Mark up this page with HTML < > > >To be successful at this assignment

    your name in the title element above the head. < </body> </html>

    <body> The Body </body>


    This is where most of the page is It can include
    Tables Lists Quotes Pictures Just about anything else

    See it

    Spaces and Returns


    HTML only recognizes ONE space between each word The <p> tag will separate with a space The <br /> tag gives a hard return
    What you type: Roses are red Violets are blue If I can do this Then so can you

    What you see: Roses are red Violets are blue If I can do this Then so can you

    Spaces and Returns


    HTML only recognizes ONE space between each word The <p> tag will separate with a space The <br /> tag gives a hard return
    What you type: <p> Roses are red <br /> Violets are blue </p> <p> If I can do this <br /> Then so can your </p>

    What you see: Roses are red Violets are blue If I can do this Then so can you

    <h1> Heading Sizes </h1>


    <h1> <h2> <h3> <h4> <h5> <h6>

    Heading One
    Heading Two
    Heading Three
    Heading Four
    Heading Five
    Heading Six

    Headings are not numbered as they go down the page The <h1> through <h6> tags refer to the size of the heading Any Heading tag can be used anywhere on the page

    Add the Heading Tags


    <html> <head> < title > (your name here)s Mark Up Assignment</title> </head>

    <body>

    Up this Page with Hyper Text Mark-up Language < >


    < < < >Other Things you May Want to Do< >Todays Assignment< > >

    >Mark

    Add the Heading Tags


    <html> <head> <title> (your name here)s Mark Up Assignment</title> </head>

    <body>
    < h1 >Mark Up this Page with HTML < /h1 > < h3 >Other Things you May Want to Do< /h3 > < h3 >Todays Assignment< /h3 >

    <p> Paragraphs </p>


    Paragraphs are separated by space from what comes before and after They are not, by default, indented
    <p>Here is some interesting information about this.</p> <p>On the other hand, there is this information here.</p>

    Here is some interesting information about this. On the other hand, there is this information here.

    Add Paragraph Tags


    < p >To be successful at this assignment you will have to be able to figure out what tags will allow you to do the things you want to do. You will need to be able to do several things < /p > >You may also want to do some other, extra things like making lists with bullets or numbers, or you may want to embed a piece of music in your page. Another thing you may want to do is use an extended quote. All of these elements can be done relatively easily with HTML< /p > < p

    <

    >What you need to do today is label this page with the tags that would make a beb page look like this. We will be discussig the different tags. If you need help, be sure that you ask an appropriate question.< /p >
    >This assignmebnt is worth 68 points. For < b > 20 bonus Points< /b > you can take this document and make it into a web page using Notepad. Save the document in your folder and check your work by openig the file with Firefox. You will need to put your name in the title element above the head element.< /p >

    <

    <ul> Un-Ordered List </ul>


    These are Bulleted lists The list begins with <ul> It ends with </ul> They dont have a particular sequence <li> each thing in the list gets list item tags </li>
    What you type: <ul> <li> Make paragraphs </li> <li> Use tables that may or may not have borders </li> <li> Make links </li> <li> Insert pictures </li> </ul>

    What you see: Make paragraphs Use tables that may or may not have borders Make links Instert pictures

    <ol> Ordered Lists </ol>


    1. <ol> stands for Ordered List 2. Signal the end of the list </ol> 3. Each element still gets the <li> & </li> tags. 4. The browser adds the numbers (or
    letters or Roman numerals)

    What you type: <ol> <li> Come to class on time</li> <li> Get out your materials for class</li> <li> Be ready to participate</li> <li> Raise your hand if you have a comment or question</li> </ol> What you see:

    1. 2. 3. 4.

    Come to class on time Get out your materials for class Be ready to participate Raise your hand if you have a comment or question

    See it

    <b><u><i> Other Formats </i></u></b>


    <body> <b>This is Bold </b> <i> This is Italicized </i> <u> This is Underlined </u> Here is a line <hr> <br/> There will be a space before this </body>
    See it

    This is Bold This is Italicized This is Underlined Here is a line

    There will be a space before this

    What you need to do:


    Fill in all the tags that are indicated on the Tag Mark-Up handout. Go to a computer and create your own Basic Page using the exact text presented in the folders at the computer. Save the Basic Page into your File Folder Each person must create their own, individual, Basic Page

    You might also like