Cera Production

Lomba Review Percetakan CeraProduction.com

Tridinamika

Tridinamika Blog Kontes 2013

Tuesday 2 July 2013

Preformatting, Span and Division Tags

1. Division Tag (<div>...</div>)

    This tag has function that same with paragraph tag, that is containing text. There is no atribute for this tag. Only special particular attribute. And then, this tag will look very useful when set by using CSS code.

    And also, this tag is block (by default). However there is no margin that will added (before and after this tag). Moreever, this tag can be inline with adding CSS code. 
For example:


...
<body>
  <div id='test1' style='border-color:red;'>
    text inserted here...
  </div>
  <div id='test2' style='border-color:blue;'>
  text inserted here...
  </div>
</body>
...
result:

 
     For style attribute on above example is part of CSS code that have function for giving special style. And also, border-color property have function for adding line color on each side of division tag.


2. Span Tag (<span>...</span>)

     Like Divistion tag, generally these tag is used when we want to make different on some of sentences from paragraph with the others by giving background color that unique. Moreover, these tag is inline (by default). 
For example: 
...
<body>
  <div id='test1'>
    text inserted<span style='background-color:#e3e3e3;'> here...</span>
  </div>
</body>
...
result:

     Although, between Division tag has added a span tag but there is no a margin between the two tags. It shows that the Span tag is inline.

3. Preformatting tag (<pre>...</pre>)

     This tag is used to show text in browser that same with text in HTML code. For example, is used to show programming codes. So that the space, tab and enter characters will showed in accordance with the contents of HTML code.
Example: 
...
<body>
  <div>
    the following is an example of programming codes
    <pre id='test1'>
      public class Test1 {
        public static void main(String args[]) {
          System.out.print("test1");
        }
      }
    </pre>
  </div>
</body>
...
result:
      The font type that is used to show the contents of preformatting tag are different with the font type default for a paragraph.

No comments:

Post a Comment

Silahkan beri komentar tentang artikel kami...