Showing posts with label basics. Show all posts
Showing posts with label basics. Show all posts

July 18, 2012

Structuring Texts in HTML


We have already seen how to insert texts into HTML, and now we will see how to structure these texts little more to our use. These ways depends on the needs that we are going to use in our site to make it look neat.

1.Line Breaks

Using <p> tag will start texts in the new line, but whatif we need to make a line break with more than two lines or more? And that's why we use line break <br /> tag.


<p>This is a paragraph.</p>
<p>This is a paragraph, but the next element will be a line break.</p>
<br />
<br />
<p>Two line breaks produced two lines of space.</p>

This above code contains two br tags that will make two line spaces.


2.Quotations

Sometimes, we need to quote important words in our texts, and there are two possible HTML tags called <blockquote> and <q> tags.


<p><q>I always believe everything anyone tells me and I'm always disappointed,</q> 
his companion says.</p>

<blockquote>A warrior trusts other people because, first and foremost, 
he trusts himself.</blockquote>

<p>It's important to trust people; a warrior of light is not afraid of disappointments.</p>


3.Abbreviations and Acronyms

When you use 'LASER' in your texts, users who do not know what is a LASER?,will be puzzled. This can be avoided by giving a hint to the users by the acronym and abbreviation tags.

An acronym always starts with the first letters of each word, like HTML. But, abbreviations doesn't have to be, like LASER.


<p><abbr title="Light Amplified by the Stimulated Emission of Radiation">LASER</abbr></p>

<p><acronym title="Hyper Text Markup Language">HTML</acronym></p>

Now, move your mouse pointer to the below words, and experience abbreviation and acronym tags.

LASER

HTML


4.Preformatted Text

HTML do not allow additional spaces within texts, which means tab spaces or line spaces does not include here and it will be noted as a single letter space. Sometimes, we need to enter text in a new line without any additional spaces or we need to make tab spaces.

Preformatted texts are much useful when we need to enter texts in new line or with tab spaces.


<pre>
''Imagination, which in truth
Is but another name for absolute power
And clearest insight, amplitude of mind,
And reason, in her most exalted mood.'
</pre>


5.Insertions and Deletions

Many times we usually have to make differences and denote what is right from the wrong. At that time, we can also indicate what;s wrong and then move to the right text. In HTML, a text can be marked wrong by a strikethrough <del> tag and also denote the right texts with an underline by the <ins> tag.


<p>The color <del>Yellow</del> will be deleted and the color <ins>Blue</ins> will be 
inserted.</p>


6.Bidirectional and Multilanguage Text

For languages that read from right to left like Arabic or Hebrew, this is a very useful and impressive option.

<bdo dir="rtl">smug desserts</bdo>


July 15, 2012

Entering Simple Texts in HTML / XHTML


Headings

Just like using heading in our normal paragraphs, we can also use headings in HTML/XHTML also. Every heading always start and end in a new line. There are six ways to include a heading in your posts, where it is one smaller than the other and so on. Therefore, you have the chance to include sub-headings without any hesitations.


<h1>Largest heading.</h1>
<h2>Second largest heading.</h2>
<h3>Third largest heading.</h3>
<h4>Fourth largest heading.</h4>
<h5>Fifth largest heading.</h5>
<h6>Smallest heading.</h6>

The output for the above code is,

Paragraphs

To include any new paragraph is much simpler too. Just like headings, it also start and end with in a new line.

<p>The first symptom of the process of our killing our dreams is the lack of time.</p>
    
<p>The second symptom of the death of our dreams lies in our certainties. Because we don’t
 want to see life as a grand adventure, we begin to think of ourselves as wise and fair and
 correct in asking so little of life.</p>
    
<p>The third symptom of the passing of our dreams is peace. Life becomes a Sunday afternoon,
 we ask for nothing grand, and we cease to demand anything more than we are willing to give.
</p>

The output is,