MMDT1021 Chapter 3 Notes - page 4

 

Creating a Line Break

Here we have four lines without <br /> tags.
Code Result
This is line one.
This is line two.
This is line three.
This is line four.
 This is line one. This is line two. This is line three. This is line four.

Here we have the same code with <br> tags.
Code Result
This is line one.<br />
This is line two.<br />
This is line three.<br />
This is line four.<br />
 This is line one.
This is line two.
This is line three.
This is line four.

Here again the differences between HTML and XHTML tag styles stand out.  HTML break tag was just <br>.  There is no such thing as a </br>, but XHTML requires the tag to be closed, so the tag is <br />.  Notice the space and the "/".

Non Breaking Space

&nbsp; (non-breaking space) has a special purpose.  It allows extra spaces between characters.  The semicolon is REQUIRED.  Also many times the   character is used as a filler "dummy" character.  like between <p> </p> or in an empty table cell like <td> </td>.

Here we have four words with spaces between them.  A maximum of one space is ever displayed.
Code Result
word1 word2   word3   word4
 word1 word2 word3 word4

Here we have the same code with &nbsp;.
Code Result
word1 word2&nbsp;&nbsp; word3&nbsp;&nbsp; word4
 word1 word2   word3   word4

Hiding Text (Adding Comments)

<!-- Comment --> allows hidden text to be inserted into an HTML document.  Mostly these are comments to yourself or others describing what your code does or other relevant notes.

These comments CAN be seen by persons that do a "View Source" of your code, so don't put sensitive data into comments (such as passwords).

Code Result
Text before <!-- Commented text --> Text Af<!-- Commented text -->ter Text before Text After

Titles (Adding Tool Tips)

Any tag can have a title added.  This serves as a tool tip.

Code Result
<h1 title="Very BIG">Header size 1</h1>

Header size 1
<p title="Just an example">
Demo paragraph text. Demo paragraph text.
</p>

Demo paragraph text. Demo paragraph text.