Pin Me

Basic Formatting Codes in HTML

written by: Maureen Cutajar•edited by: Michele McDonough•updated: 3/25/2010

HTML coding can be used to format the content of the document located in the element. Apart from the textual content of the document, the element can contain HTML coding relating to HTML font codes, phrase elements, and linking tags.

  • slide 1 of 4

    Basic HTML Codes

    The <p> tag defines a paragraph. An extra blank line is added before and after a paragraph.

    The <br> tag differs from the <p> tag in that it inserts a single line break. Unlike the <p> tag the <br> tag is an empty tag, meaning that it has no end tag in HTML i.e. <br></br> is incorrect. However, whereas in HTML the <br> tag has no end tag in XHTML the <br> tag is closed like this <br />

    It is important to note that the <br> tag is used in an HTML document to enter blank lines and not to separate paragraphs. The latter function is achieved by using the <p> tag.

  • slide 2 of 4

    HTML Font Styles

    The following elements are all font style elements. Although these font styles are still used, more intricate font styles are achieved using cascading style sheets.

    • <tt> - teletype or mono spaced text
    • <i> - italic text
    • <b> - bold text
    • <big> - bigger text
    • <small> - smaller text
  • slide 3 of 4

    HTML Phrase Elements

    The following elements are all phrase elements. Again it is possible to achieve a richer effect using style sheets.

    • <em> - emphasized text
    • <strong> - strong emphasized text
    • <dfn> - definition term
    • <code> - computer code text
    • <samp> - sample computer code
    • <kbd> - keyboard text
    • <var> - defines a variable
    • <cite> - citation
  • slide 4 of 4

    Anchor Tags and HTML Links

    Through HTML, web developers have the ability to link text and images to another document which is stored on the same server or a remote server. A hypertext link is marked by the browser by using a different color or underlining the specified text.

    To create a single hypertext-related in HTML the <a> tag (anchor tag) is used. To include an anchor in your document follow the steps outlined below:

    • Place an anchor tag, specifying the document that is being linked linking as the href attribute
    • Place the data (text/images) that will serve as a link between the opening and closing <a> tags.
    • Example <a href="some_page.html">Link to some page</a>

    The anchor tag can be used to link documents within the same server by using relative links. Relative links refer to links which specify the location of the current file on the server.

    Relative links use the standard UNIX syntax. The parent directory is identified as “.. while the directory separator is “/”. For example, to access a file in the parent directory’s misc directory, one would use (../misc/somefile.html).

    Alternatively, the anchor tag can be used to specify the absolute pathname (the complete URL) of the file. The World Wide Web uses Uniform Resource Locators (URLs) to specify the location of files on other servers.

    It is also possible to use the anchor tag to link to a specific email address on the web by including the mailto attribute in a hyperlink. The format is: <a href="mailto:email@host">Send an email to Someone</a>

    Supported linking attributes are:

    • href - The target URL of the link
    • name – Used to create a bookmark in a document. In XHTML, the name attribute is replaced by the id attribute.
    • target – Specifies where to open the target URL.
      • _blank uses a new window
      • _self uses the same frame
      • _parent uses parent frameset
      • _top uses the full body of the window

    Stay tuned for more linking attributes in relation to page sections and images in the next article of the HTML Web Page Coding Series.

HTML Web Page Coding

This series will guide users through a number of articles that explain basic HTML web page coding starting from the basic elements of an HTML document to advanced HTML coding that includes how to insert a table and build forms in a web page with HTML code.
  1. The Structure of an HTML Document
  2. Basic Formatting Codes in HTML
  3. Advanced Formatting in HTML
  4. How to Build Forms in HTML