Wednesday, 26 October 2016

HTML TABLES

HTML Tables allow web developers to arrange their text, data, images, link in form of row and columns.

 <table> tag is used to create table in html. <tr> tag is used inside table tag for making a row cell. <td> tag is placed inside tr tag and is used for each data cell. 

 For creating separate head body and footers in table we can use three different tags.
  • <thead> - for table header.
  • <tbody> - for body of the table.
  • <tfoot> -  for table footer.
Cell Padding and cell spacing are used for giving white spaces in table. Border of the table can also be changed using the border attribute of the table.

<html>
<head>
<title>HTML TABLES</title>
</head>
<body>
<table border="3px" cellpadding="5" cellspacing="5">
<tr>
<th>Name</th>
<th>Age</th>
<th>Salary</th>
</tr>
<tr>
<td>Employee 1</td>
<td>50</td>
<td>10000</td>
</tr>
<tr>
<td>Employee 2</td>
<td>7000</td>
<td>20000</td>
</tr>
</table>

</body>
</html>


Posted by at No comments:

Tuesday, 25 October 2016

HTML LISTS

In this topic we will learn another great property of HTML which is making list of data in our page. There are two types of list available: ordered list and un-ordered list.
    The basic difference between these two is that just like by its name unordered there be will be no numbering or alphabets to represent its sequence where as in ordered list there are numbers by default to represent the sequence of items in list

Unordered List:

<ul> tag is used for unordered list. Each item of unordered list starts with <li> tag. We can also give inline styling to change the design of bullets, but we will discuss the styling with details in our CSS tutorials. 


Ordered List:

<ol> tag is used for ordered list. Each item of ordered list starts with <li> tag. We can also give inline styling to change the numbers in to alphabets or in roman numbers.

 <html>
<head>
<title>HTML LIST TAGS</title>
</head>

<body>
<h3>Un Ordered List</h3>
  <ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  </ul>
  <h3>Ordered List</h3>
  <ol>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
       </ol>
</body>
</html>


Posted by at No comments:

Monday, 24 October 2016

MAIN HTML TAGS


In this tutorial we are going to discuss about the basic html tags(head,title,heading,body). Mainly we use head and body tag for writing a common html page. In head tag we include scripts, meta tags, css sheets(will be discussed later). In body tag we write the structure of the page or in common words which we want to show on our page.
         
             In head tag we can use title tag to show user what the page is about, It will be displayed on the top bar of the page.
         
           There are different set of sizes and font available for html heading varying from 1 to 6. One can use them according to their need. Heading tags are placed in body tag.

<html>
<head>
<title>HTML HEADING TAGS</title>
</head>
  <body>
   <h1>Heading 1</h1>
   <h2>Heading 2</h2>
   <h3>Heading 3</h3>
   <h4>Heading 4</h4>
   <h5>Heading 5</h5>
   <h6>Heading 6</h6>
</body>
</html>





Posted by at No comments:

Monday, 23 May 2016

HTML Tutorial 1(BASIC STRUCTURE)

In this tutorial we will start with basic html page. For starters, they will first download XAMPP or WAMP from their official websites and extract files in to localdisk ( Let say LocalDisk C:).

    You can also download Editor(Dreamweaver or others) but you can also use notepad. First open notepad and save file tutorial1 (C:/xampp/htdocs). In htdocs folders place file tutorial1 with extension html(tutorial1.html).

    <!DOCTYPE html>
      <html>
         <body>
            <h1>Tutorial 1</h1>
         </body>
      </html>

Place the above code in tutorial1.html and save it. To run that code right click on file tutorail1.html and openwith any browser(prefer chorme).






Posted by at No comments:
Subscribe to: Comments (Atom)