Infotechmon best training center in mohali

HTML Exercise

HTML Exercises

Complete this exercise to refine your html skills

HTML is the standard markup language for creating Web pages.

What is HTML?

  • HTML stands for Hyper Text Markup Language
  • HTML is the standard markup language for creating Web pages
  • HTML describes the structure of a Web page
  • HTML consists of a series of elements
  • HTML elements tell the browser how to display the content
  • HTML elements label pieces of content such as “this is a heading”, “this is a paragraph”, “this is a link”, etc.
Following are the Questions/task which is needed to perform by all the students related to this topic
    HTML basics exercises
  • Create a webpage that prints your name to the screen.
  • Create a webpage that prints the numbers 1 – 10 to the screen.
  • Create a webpage and set its title to “This is a webpage”.
  • Create a webpage that prints the message “When was this webpage created? Check page’s title for the answer.” to the screen, and set the title of the page to the current date.
  • Create a webpage that prints any text of your choosing to the screen, do not include a head section in the code.
  • Repeat exercise #5, but this time include a head section in the code.
NOTE: Include comments in every HTML basics exercise.
HTML text exercises
  • Print your name in green.
  • Print the numbers 1 – 10, each number being a different color.
  • Prints your name in a Tahoma font.
  • Print a paragraph with 4 – 5 sentences. Each sentence should be a different font.
  • Print a paragraph that is a description of a book, include the title of the book as well as its author. Names and titles should be underlined, adjectives should be italicized and bolded.
  • Print your name to the screen with every letter being a different heading size.
HTML text formatting exercises
  • Print the squares of the numbers 1 – 20. Each number should be on a separate line, next to it the number 2 superscripted, an equal sign and the result. (Example: 102= 100)
  • Prints 10 names with a line break between each name. The list should be alphabetized, and to do this place a subscripted number next to each name based on where it will go in the alphabetized list. (Example: Alan1). Print first, the unalphabetized list with a subscript number next to each name, then the alphabetized list. Both lists should have an h1 level heading.
  • Print two paragraphs that are both indented using the nbsp; command.
  • Print two lists with any information you want. One list should be an ordered list, the other list should be an unordered list.
  • Prints an h1 level heading followed by a horizontal line whose width is 100%. Below the horizontal line print a paragraph relating to the text in the heading.
  • Print some preformatted text of your choosing.
  • Print a long quote and a short quote. Cite the author of each quote.
  • Print some deleted and inserted text of your choosing.
  • Print a definition list with 5 items.
  • Print two addresses in the same format used on the front of envelopes (senders address in top left corner, receivers address in the center).
  • Print ten acronyms and abbreviations of your choosing, each separated by two lines. Specify the data that the abbreviations and acronyms represent.
HTML link exercises
  • Create some links to various search engines (google, yahoo, altavista, lycos, etc).
  • Create links to five different pages on five different websites that should all open in a new window.
  • Create a page with a link at the top of it that when clicked will jump all the way to the bottom of the page.
  • Create a page with a link at the bottom of it that when clicked will jump all the way to the top of the page.
  • Create a page with a link at the top of it that when clicked will jump all the way to the bottom of the page. At the bottom of the page there should be a link to jump back to the top of the page.
HTML image exercises
  • Display five different images. Skip two lines between each image. Each image should have a title.
  • Display an image that has a border of size 2, a width of 200, and a height of 200.
  • Display an image that when clicked will link to a search engine of your choice (should be opened in a new window).
  • Display an image that when clicked will link to itself and will display the image in the browser by itself.
NOTE: Include the alt attribute in every img tag in the HTML image exercises.  
HTML basics
  • Setting a background color
  • Including comments in code
  • Setting the title of a document
  • A simple HTML document
HTML text
  • Displaying bold, italic, or underlined text
  • Displaying text in different sizes using headings
  • Displaying text in different fonts, sizes, and colors
  • Using various text tags at once
HTML text formatting
  • Abbreviations and acronyms
  • Displaying text as an address
  • Skipping lines in a webpage
  • Using computer-output tags
  • Definition lists
  • Deleting and inserting text
  • Creating horizontal lines
  • Creating an ordered list
  • Creating ordered lists
  • Creating an unordered list
  • Creating unordered lists
  • Creating nested lists
  • Displaying paragraphs
  • Displaying preformatted text
  • Displaying quotations
  • Setting text to a subscript or superscript
  • Setting text direction
HTML links
  • Linking to other websites
  • Linking to other directories
  • Linking within the same page
  • Opening links in a new window
  • Linking to resources other than webpages
HTML images
  • Displaying images from the same directory
  • Displaying images from another directory or website
  • Setting a background image
  • Setting an image to different sizes
  • Setting image border size
  • Setting an image as a link
  • Setting a title for an image
  • Aligning an image with a paragraph
HTML imagemaps
  • Associating an image with an imagemap
  • A completed imagemap
HTML tables
  • Basic HTML table
  • Table celpadding
  • Table cellspacing
  • Table cell background color
  • Table cell background image
  • Table with empty cells
  • Table row span and column span
  • Table background color
  • Table background image
  • Table borders size
  • Table caption
  • Table cell alignment
  • Table ‘frame’ attribute
  • Table headings
  • Table without borders
  • Tags in tables
  • Nested tables
HTML frames
  • Horizontal frames
  • Vertical frames
  • Mixed frames
  • Frame jumping
  • Navigational frames
  • Frames with no borders
  • Frames not supported
  • Frames not resizable
HTML forms
  • Form buttons
  • Form checkboxes
  • Form fieldset
  • Form hidden fields
  • Form images
  • Form password field
  • Form radio buttons
  • Form textarea
  • Form textbox
  • Submit a form
  • Reset a form
  • all features of Forms
HTML stylesheets
  • External stylesheet
  • Internal stylesheet
  • Inline stylesheet
HTML meta tags
  • Specifying a page author
  • Specifying a page description
  • Specifying a page expiration
  • Specifying a page generator
  • Specifying keywords for a page
  • Preventing frames
  • Redirecting the user from one page to another
HTML document types
  • Transitional document
  • Frameset document
  • Strict document
HTML base
  • Setting a reference point
  • Opening links in a new window
HTML scripts
  • Placing a script on a webpage
  • Dealing with browsers that cannot execute scripts

Leave a Comment

Your email address will not be published. Required fields are marked *