BLOCKS, PARAGRAPHS, LISTS, TABLES - INSERTING TABLES IN HTML FILES

[Die2mrw007]

BLOCKS, PARAGRAPHS, LISTS, TABLES - INSERTING TABLES IN HTML FILES

HTML gives you the possibility to insert 2-dimensional tables (that is to say tables with rows and columns). The best way for you to understand how to create HTML tables is still to have a look at a practical example:

HTML code:

Output in the web browser:

Remarks:

An HTML table is created with the tags <table> and </table>

An HTML table can be given a caption with the tags <caption> and </caption>.

A row is created with the tags <tr> and </tr>, and columns can be created within these rows with the tags <td> and </td>.

The attribute bgcolor allows you to change the background color of a row, column or cell.

BLOCKS, PARAGRAPHS, LISTS, TABLES - ORGANIZING TEXT INTO PARAGRAPHS

Paragraphs are easy to create in HTML: all you have to do is use the tags <p>Put the text here</p>.

BLOCKS, PARAGRAPHS, LISTS, TABLES - CREATING LISTS IN HTML

HTML allows you to create bulleted lists. Just as before, an example will suffice to introduce the corresponding HTML syntax:

Learn the HTML code:

Output in the web browser:

The bulleted list above is an example of unordered list. This is the reason why the list begins with the HTML tag <ul> (as in "unordered list") and ends with the HTML tag </ul>. As for the tags <li> and </li>, they denote list items.

In addition to unordered lists, there also exist ordered lists. The only difference in the syntax is that ordered lists will begin with the HTML tag <ol> and end with the HTML tag </ol>. Let's consider the very same example but this time featuring an ordered list:

Learn the HTML code:

Output in the web browser:

Remark:

Instead of disc bullets, you now have numbers (which seems perfectly normal since your list is supposed to be ordered).

There are different ways to change the bullets of your lists; a first way would be to use CSS stylesheets, which would permit you to use different types of bullets (or even your own).

Another way would be to use the deprecated type attribute in the ul, ol and li tags. For unordered lists, type can take the values disc, circle or square. For ordered lists, it can take the values a, A, I, i, and 1 depending on the kind of numbering you prefer. Let's now try the previous example again with an unordered list featuring square bullets:

Learn the HTML code:

Output in the web browser:

BLOCKS, PARAGRAPHS, LISTS, TABLES - HTML BLOCKS AND HTML INLINE CONTENT

In the HTML language, you can group elements in order to apply certain properties on a macro-level instead of having to apply them repeatedly to different elements. Generally, such grouping of HTML elements is realized with the HTML tags <div> and </div> in order to create blocks, and with the HTML tags <span> and </span> for inline content, the difference being that the use of <div> will trigger the creation of a block starting at a new line, while the use of <span> will create that block on the current line.

In the example below, we show how the creation of a <div> block allows to align the text at the center of the line:

HTML code:

Output in the web browser:

Remark:

The HTML tags <div> and <span> will be used extensively in CSS stylesheets in order to optimize the formatting of your HTML webpages. For more information about this topic, please refer to our CSS tutorials.

We have seen that the HTML language offers a variety of structures which allow you to group your HTML content and define its properties more efficiently. This allows you to make this web content easy to move, convenient to update and more scalable. All these reasons will naturally lead you to learn more about CSS stylesheets, which represent the next step in the quest for more web development scalability.

[Gaurav619]

i know this ,but +1 for sharing 

[Die2mrw007]

i know this ,but +1 for sharing 

Yup, its basic

mainly for newbies interested in learning HTML