Add a zoom/increase scale effect for table text using css

by Jayanthi 2014-03-20 11:38:11

zoom/increase scale effect for table text
<html>
<style>
table th:hover{
-webkit-transform: scale(1.2, 1.5);
-moz-transform: scale(1.2, 1.5);
-o-transform: scale(1.2, 1.5);
-ms-transform: scale(1.2, 1.5);
transform: scale(1.2, 1.5);
color: green;
}
table td:hover{
-webkit-transform: scale(1.1, 1.5);
-moz-transform: scale(1.1, 1.5);
-o-transform: scale(1.1, 1.5);
-ms-transform: scale(1.1, 1.5);
transform: scale(1.1, 1.5);
color: #993300;
}
</style>

<table cellpadding='5'>
<tr><th>no</th><th>name</th><th>qty</th><th>rate</th></tr>
<tr><td>1</td><td>oil</td><td>1</td><td>116</td></tr>
<tr><td>2</td><td>ghee</td><td>1</td><td>205</td></tr>
<tr><td>3</td><td>rice</td><td>1</td><td>67</td></tr>
</table>
</html>



1609
like
0
dislike
0
mail
flag

You must LOGIN to add comments