How to Make a transparent and Table In html & Css

Int his article we will create a beautiful ,wonderful and good looking table using html and Css.
HTML (Hyper Text Markup Language) is the most powerful language for creating web pages.And the design/style we give it to our pages is called Css.

You can use this code...

CSS CODE:

body{

background-image:url(b.jpg);background-size:cover;}

table{

border:2px solid salmon;border-collapse:collapse;width:50%;margin:auto;font-size:18px; font-family:georgia;

opacity:0.7;}

table,td,th{ border:2px solid salmon;padding:4px;}

.header{ font-size:2em;height:100px;background-color:firebrick;}

.c1{ background-color:limegreen;}

tr:nth-child(even){background-color:silver;}

tr:nth-child(odd){background-color:snow;}

.header a{color:#000;text-decoration:none;}

.header a:hover{

color:blue;text-decoration:underline;}

HTML CODE:

<table>
<tr>
<th colspan="6" class="header"><a href="">Mark Sheet Certificate</a></th></tr>
<tr><th colspan="3" class="c1">Student Name</th><th colspan="3" class="c1"> Father Name</th></tr>

<tr><td colspan="3">Sana Ullah</td><td colspan="3">Muhammad Ishaq</td></tr>

<tr><th>Class</th><th colspan="2">11th</th><th colspan="2">12th</th><th></th></tr>

<tr><th>Subjects</th><th>Total Marks</th><th>Obtained marks</th><th>Total Marks</th><th>Obtainedmarks</th><th>Practical</th></tr>

<tr><td>English</td><td>100</td><td>98</td><td>100</td><td>98</td><td></td></tr>

<tr><td>Urdu</td><td>100</td><td>98</td><td>100</td><td>98</td><td></td></tr>

<tr><td>Islamiat</td><td>50</td><td>45</td><td>50</td><td>45</td><td></td></tr>

<tr><td>Mathematics</td><td>100</td><td>98</td><td>100</td><td>98</td><td></td></tr>

<tr><td>Chemistry</td><td>85</td><td>83</td><td>85</td><td>84</td><td>30</td></tr>

<tr><td>Physics</td><td>85</td><td>83</td><td>85</td><td>83</td><td>30</td></tr>

</table>

Also Watch the video for full Understanding...

Subscribe to my youtube Channel...

https://www.youtube.com/channel/UCGqiXPhh-LN3aYEqOFixA6A?view_as=subscriber