HTML Table Example-Third

Write a program to create HTML table having cell borders using CSS to create following output:

asp-practice-questions-CodingFusion.com

Solution:

1) CSS

<style type="text/css">
       .studentInfo {
           width: 500px;
           border-collapse: collapse;
       }
 
           .studentInfo td {
               border: 1px solid black;
           }
 
       .header {
           text-align: center;
           font-weight: bolder;
       }
   </style>

1) Table HTML

<table class="studentInfo">
        <tbody><tr>
            <td class="header" colspan="6">STUDENTS MARK SHEET</td>
        </tr>
        <tr>
            <td>Name</td>
            <td>Maths</td>
            <td>Science</td>
            <td>English</td>
            <td>Physics</td>
            <td>General Knowledge</td>
        </tr>
        <tr>
            <td>David</td>
            <td>85</td>
            <td>87</td>
            <td>88</td>
            <td>92</td>
            <td>88</td>
        </tr>
        <tr>
            <td>Richard</td>
            <td>91</td>
            <td>81</td>
            <td>78</td>
            <td>71</td>
            <td>74</td>
        </tr>
        <tr>
            <td>John</td>
            <td>81</td>
            <td>86</td>
            <td>88</td>
            <td>84</td>
            <td>92</td>
        </tr>
        <tr>
            <td>Tony</td>
            <td>84</td>
            <td>86</td>
            <td>87</td>
            <td>82</td>
            <td>81</td>
        </tr>
        <tr>
            <td>Scott</td>
            <td>71</td>
            <td>79</td>
            <td>82</td>
            <td>88</td>
            <td>89</td>
        </tr>
    </tbody></table>

HTML Table Example-Third

Subscribe for Latest Updates.