HTML Project

Chapter: 5

Insert Table & Links in html page

insert table in html page
and links in table
Start from index.html file

Open index.html file

Where the division<div class="col_one_third_last"> is over, after it add new division in index.html
with class name "col_two_third"
now add a table in this division
or copy and paste the following code in it
<div class="col_two_third"><!-- col_two_third for table Start here -->
  <h3>this is my table</h3>
  <table style="width:100%">
	  <th align="left" width="10%">No.</th>
	  <th align="left" width="35%">Subject</th>
	  <th align="left" width="55%">Link</th>
	  <td><a href="">Learn html</a></td>
	  <td><a href="">Learn css</a></td>
	  <td><a href="">Learn php</a></td>
	  <td><a href="">Learn JavaScript</a></td>
	  <td>Android</td> <td><a href="">Learn Android</a></td>
	  <td><a href="">Learn Bootstrap</a></td>
</div><!-- col_two_third for table over here -->

Open style.css file

add code for table in style.css
or copy and paste the following code in it
.col_two_third table{
	text-decoration: none;
	border-collapse: collapse

.col_two_third table a{
	font-family: Courier New, monospace;
	color: #a01a7d;
	text-decoration: none;
	-webkit-transition: 1s;
	-webkit-transition-timing-function: ease;

.col_two_third table a:hover{
	color: #192bc2;
	text-decoration: none;

/*th for table head*/
.col_two_third th{
	padding-left: 10px;
	color: #ffffff;

/*tr for table row*/
.col_two_third tr{
	border-bottom:1px dotted #999999;

.col_two_third td{
	padding-left: 10px;

It's time to check the result

Now open index.html file in browser
You can change the color, fonts etc. in css file