How to Create HTML Table with Attributes:

Development is the essential and magnificent part of every website or application. As in earlier lesson, We learned about HTML List and it types explanatory. With the help of hyper text markup language, We can develop web pages interface and make it user-friendly. In this lesson, we will divulge the html tables with comprehensive explanation. A simple html table consist on numerous/given rows and columns. Rows look like a horizontal line and columns look like vertical line. But in html, We write particular code to build html table with rows and columns. Lets see below code and its result.

In the above table, We clearly build simple table with specific html table code. In this code we utilize few tag such as tr which stands for table row next is td which stands for table data. Inside table tag you can put table border like this code border="3" this is look like a border/grid of this table. You can also put background color with this tiny code bgcolor="Green" and simply type your color name or color code. But if you noticed that, first row of above table is bold instead of second and third rows. Actually in first row,  we applied this tag th Which stands for table heading and this tag represent the first row as a heading of this html table. For beginners its look like a complicated cobweb but with the passage of time and daily practice, You will be capable to understand this code easily. Lets take a little bit enhancement in this html table, See below.

In the above table , We accumulate the two rows and merge in one row with the help of colspan="2".This code does extend the current row cell and include the second row in themselves. If you noticed that, We added this code inside th heading tag therefore, this code apply only for this specific area. You can try this colspan="2" on many of places of your html table code. Secondly same as colspan="2" You can try Rowspan="2" then compile it and check display. See the example below.

In the above table , We accumulate the two columns and merge in one column with the help of Rowspan="2".This code does extend the current column and include the second column in themselves. Actually in simple words, colspan="2" & Rowspan="2" are vice versa to each other. Don’t be worried, because this is not a tricky task for beginners. Always practice as yourself and share your coding skills with your friends.

The above all procedure build html table respectively. Grab and copy these codes and try it as yourself. Without practice and struggle, You will not get your aims and maybe forget your coding skills. Be professional with your passion. If you have more questions regarding html table then tell me below.