HTML code of table with various row and column size - html

It seems easy but can't write the HTML code of the above table.
Here is what I tried so far:
<table border="1" style="border-collapse:collapse;" width="25%">
<tr>
<td>col1</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
</table>

Sure you want html??
<table align="center" width="590" height="590" >
<tr>
<td align="center" height="80" colspan="4">central text</td>
</tr>
<tr>
<td align="center" height="80" colspan="2">col</td>
<td align="center" colspan="2">col</td>
</tr>
<tr>
<td align="center" height="40">t</td>
<td align="center" height="40">t</td>
<td align="center" height="80" rowspan="2">t</td>
<td align="center" rowspan="2">t</td>
</tr>
<tr>
<td align="center" height="40">t</td>
<td align="center" height="40">t</td>
</tr>
<tr>
<td align="center" height="30">t</td>
<td align="center" >t</td>
<td align="center" >t</td>
<td align="center" >t</td>
</tr>
</table>
Like this?

colspan and rowspan was missing from your code.
<table border="1" style="border-collapse: collapse;">
<tr>
<td colspan=4 align="center">central text</td>
</tr>
<tr>
<td colspan=2 align="center">col(1)</td>
<td colspan=2 align="center">col(2)</td>
</tr>
<tr>
<td align="center">text</td>
<td align="center">text</td>
<td rowspan=2 align="center">text</td>
<td rowspan=2 align="center">text</td>
</tr>
</tr>
<tr>
<td align="center">text</td>
<td align="center">text</td>
</tr>
<tr>
<td align="center">text</td>
<td align="center">text</td>
<td align="center">text</td>
<td align="center">text</td>
</tr>
</table>

Related

Making a table in HTML

What do you think should I do to make my code's output like in the photo?
Thank you for answering.
(I am typing any words in here because stackoverflow doesnt let me post this. This is the most detailed thing I can think of. I am new to the programming world and I have no one to assist me that's why I am asking for some help. Thank you for understanding.)
Here's my code:
<table border="1" cellpadding="20% " width="20%" cellspacing="0">
<tr>
<td rowspan="10"></td>
<td colspan="9"></td>
</tr>
<tr>
<td rowspan="9"></td>
<td colspan="8"></td>
</tr>
<tr>
<td rowspan="8"></td>
<td colspan="7"></td>
</tr>
<tr>
<td rowspan="7"></td>
<td colspan="6"></td>
</tr>
<tr>
<td rowspan="6"></td>
<td colspan="5"></td>
</tr>
<tr>
<td rowspan="5"></td>
<td colspan="4"></td>
</tr>
<tr>
<td rowspan="4"></td>
<td colspan="3"></td>
</tr>
<tr>
<td rowspan="3"></td>
<td colspan="2"></td>
</tr>
<tr>
<td rowspan="2"></td>
<td colspan="1"></td>
</tr>
<tr>
<td rowspan="0">
</td>
</tr>
</table>
enter image description here
make table inside td
<td rowspan="0" style="padding: 0; border: none;">
<table border="1" cellpadding="10% " width="20%" cellspacing="0">
<tr>
<td></td>
<td></td>
</tr><tr>
<td></td>
<td></td>
</tr>
</table>
</td>
<table border="1" cellpadding="20% " width="20%" cellspacing="0">
<tr>
<td rowspan="10"></td>
<td colspan="9"></td>
</tr>
<tr>
<td rowspan="9"></td>
<td colspan="8"></td>
</tr>
<tr>
<td rowspan="8"></td>
<td colspan="7"></td>
</tr>
<tr>
<td rowspan="7"></td>
<td colspan="6"></td>
</tr>
<tr>
<td rowspan="6"></td>
<td colspan="5"></td>
</tr>
<tr>
<td rowspan="5"></td>
<td colspan="4"></td>
</tr>
<tr>
<td rowspan="4"></td>
<td colspan="3"></td>
</tr>
<tr>
<td rowspan="3"></td>
<td colspan="2"></td>
</tr>
<tr>
<td rowspan="2"></td>
<td colspan="1"></td>
</tr>
<tr>
<td rowspan="0" style="padding: 0; border: none;">
<table border="1" cellpadding="10% " width="20%" cellspacing="0">
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
</td>
</tr>
</table>

How to create a table layout like this

am trying to create a table layout like this:
<img src='data:image/png;base64,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'/>
So far I achive this:
<table class="table">
<tr>
<th colspan="2" scope="colgroup">INCOME</th>
<th colspan="2" scope="colgroup">EXPENSE</th>
</tr>
<tr>
<td>30,000</td>
<td>100,000</td>
<td>80,000</td>
</tr>
<tr>
<td>5,000</td>
<td>12,000</td>
<td>9,000</td>
</tr>
</table>
Can anybody try to help me with this?
Try this one
<table class="table" width="100%" border="1" style="border-collapse: collapse;">
<tr>
<th width="50%" colspan="2">INCOME</th>
<th width="50%" colspan="2">EXPENSE</th>
</tr>
<tr>
<td width="25%">Name A</td>
<td width="25%"><center>10,000</center></td>
<td width="25%">Name A</td>
<td width="25%"><center>5,000</center></td>
</tr>
<tr>
<td width="25%">Name B</td>
<td width="25%"><center>10,000</center></td>
<td width="25%">Name B</td>
<td width="25%"><center>5,000</center></td>
</tr>
<tr>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"><center><b>Total</b></center></td>
<td width="25%"><center>20,000</center></td>
<td width="25%"><center><b>Total</b></center></td>
<td width="25%"><center>10,000</center></td>
</tr>
<tr>
<th width="50%" colspan="2">money start</th>
<th width="50%" colspan="2">1,000.00</th>
</tr>
<tr>
<th width="50%" colspan="2">daily money</th>
<th width="50%" colspan="2">10,00</th>
</tr>
<tr>
<th width="50%" colspan="2">overall</th>
<th width="50%" colspan="2">1.010,00</th>
</tr>
</table>
Could this html markup help you?
<table class="table" border=2>
<tr>
<th colspan="2" scope="colgroup">INCOME</th>
<th colspan="2" scope="colgroup">EXPENSE</th>
</tr>
<tr>
<td>Name A</td>
<td>10,00</td>
<td>name b</td>
<td>10,00</td>
</tr>
<tr>
<td>Name A</td>
<td>5,00</td>
<td>Name B</td>
<td>5,00</td>
</tr>
<tr>
<td>TOTAL:</td>
<td>20,00</td>
<td>TOTAL:</td>
<td>10,00</td>
</tr>
<tr>
<td colspan="2">Money start</td>
<td colspan="2">1.000,00</td>
</tr>
<tr>
<td colspan="2">Daily money</td>
<td colspan="2">10,00</td>
</tr>
<tr>
<td colspan="2">Overall</td>
<td colspan="2">1.010,00</td>
</tr>
</table>

Extract data from html table with dart

There is a public web page that shows me information within three tables. I want to extract this information, but unfortunately I don't have an API for this, which I could use in my code. I thought about how this could best be solved and came to the conclusion that an analysis of the HTML code is unavoidable. So I would make an http get request and "cut" the data out of the response. One of the tables looks something like this
<table border="3" rules="all" cellpadding="1" cellspacing="1">
<tbody>
<tr>
<td align="center">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial" color="#000000">
<b>Mo</b>
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
<b>Di</b>
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
<b>Mi</b>
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
<b>Do</b>
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
<b>Fr</b>
</font></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
7:35
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
8:20
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1" bgcolor="#010101">
<table width="100%">
<tbody>
<tr>
<td width="33%" bgcolor="#010101" nowrap="1"><font size="3" face="Arial" color="#FFFFFF">
WSP
</font></td>
<td width="33%" bgcolor="#010101" nowrap="1"><font size="3" face="Arial" color="#FFFFFF">
wü
</font></td>
<td width="33%" bgcolor="#010101" nowrap="1"><font size="3" face="Arial" color="#FFFFFF">
8k
</font></td>
</tr>
<tr>
<td colspan="3" width="33%" bgcolor="#010101" nowrap="1"><font size="3" face="Arial"
color="#FFFFFF">
A213
</font></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial" color="#000000">
8:25
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
9:10
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="4" align="center" nowrap="1" bgcolor="#80FF80">
<table width="100%">
<tbody>
<tr>
<td width="33%" bgcolor="#80FF80" nowrap="1"><font size="3" face="Arial" color="#000000">
Phy
</font></td>
<td width="33%" bgcolor="#80FF80" nowrap="1"><font size="3" face="Arial" color="#000000">
mp
</font></td>
<td width="33%" bgcolor="#80FF80" nowrap="1"><font size="3" face="Arial" color="#000000">
8k
</font></td>
</tr>
<tr>
<td colspan="3" width="33%" bgcolor="#80FF80" nowrap="1"><font size="3" face="Arial"
color="#000000">
A236
</font></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial" color="#000000">
9:15
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
10:00
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
10:20
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
11:05
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="4" align="center" nowrap="1" bgcolor="#8080FF">
<table width="100%">
<tbody>
<tr>
<td width="33%" bgcolor="#8080FF" nowrap="1"><font size="3" face="Arial" color="#000000">
G&P
</font></td>
<td width="33%" bgcolor="#8080FF" nowrap="1"><font size="3" face="Arial" color="#000000">
hn
</font></td>
<td width="33%" bgcolor="#8080FF" nowrap="1"><font size="3" face="Arial" color="#000000">
8k
</font></td>
</tr>
<tr>
<td colspan="3" width="33%" bgcolor="#8080FF" nowrap="1"><font size="3" face="Arial"
color="#000000">
A312
</font></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial" color="#000000">
11:10
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
11:55
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
12:00
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
12:45
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
12:55
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
13:40
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="4" align="center" nowrap="1" bgcolor="#8000FF">
<table width="100%">
<tbody>
<tr>
<td width="33%" bgcolor="#8000FF" nowrap="1"><font size="3" face="Arial" color="#FFFFFF">
Deu
</font></td>
<td width="33%" bgcolor="#8000FF" nowrap="1"><font size="3" face="Arial" color="#FFFFFF">
mu
</font></td>
<td width="33%" bgcolor="#8000FF" nowrap="1"><font size="3" face="Arial" color="#FFFFFF">
8k
</font></td>
</tr>
<tr>
<td colspan="3" width="33%" bgcolor="#8000FF" nowrap="1"><font size="3" face="Arial"
color="#FFFFFF">
A413
</font></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial" color="#000000">
13:45
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
14:30
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="4" align="center" nowrap="1" bgcolor="#FF8040">
<table width="100%">
<tbody>
<tr>
<td width="33%" bgcolor="#FF8040" nowrap="1"><font size="3" face="Arial" color="#000000">
MatS
</font></td>
<td width="33%" bgcolor="#FF8040" nowrap="1"><font size="3" face="Arial" color="#000000">
rm
</font></td>
<td width="33%" bgcolor="#FF8040" nowrap="1"><font size="3" face="Arial" color="#000000">
8k
</font></td>
</tr>
<tr>
<td colspan="3" width="33%" bgcolor="#FF8040" nowrap="1"><font size="3" face="Arial"
color="#000000">
A202
</font></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial" color="#000000">
15:35
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
16:20
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
16:25
</font></td>
</tr>
<tr>
<td align="center" nowrap="1"><font size="3" face="Arial">
17:10
</font></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1">
<table width="100%">
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td colspan="12" rowspan="2" align="center" nowrap="1" bgcolor="#0000A0">
<table width="100%">
<tbody>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
</tbody>
</table>
So I have a huge block from which I only want to filter out the following data.
I don't expect a ready-made solution, just a food for thought. I want to solve this problem with Dart and would treat all HTML as a string, whereupon I would cut this string and read the data from the resulting array.

Removing bottom border of particular td

I have a table which is like
You can see the border below Operation Research, under the course column. I want that border to be removed, but the code I've written is not working, what exactly should I do?
<html>
<body>
<table width="100%" border="1" rules="cols" style="border-collapse : collapse;">
<tr>
<td align="center" width="54%" style="border : solid thin;">Courses</td>
<td align="center" width="23%" style="border : solid thin;">CGPA</td>
<td align="center" width="23%" style="border : solid thin;">Credit</td>
</tr>
<tr>
<td>English Language Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Additional Language Course<br> French</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Foundation Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Core Course<br>Physics<br> Physics</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Complementary Course(s) <br> Mathematics <br> Chemsitry </td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td style="border-bottom : none;">Open Course <br> Operations Research</td>
<td align="center" style="border-bottom : solid thin;">8.1</td>
<td align="center" style="border-bottom : solid thin;">19</td>
</tr>
<tr height="35px">
<td></td>
<td align="center" colspan="2">Semester wise SCPA</td>
</tr>
</table>
<table width="100%">
<tr>
</tr>
</table>
</body>
</html>
Since it is border of table you have to remove that.
Use following code
<html>
<body>
<table width="100%" border="1" rules="cols" style="border : none;">
<tr>
<td align="center" width="54%" style="border : solid thin;">Courses</td>
<td align="center" width="23%" style="border : solid thin;">CGPA</td>
<td align="center" width="23%" style="border : solid thin;">Credit</td>
</tr>
<tr>
<td>English Language Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Additional Language Course<br> French</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Foundation Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Core Course<br>Physics<br> Physics</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Complementary Course(s) <br> Mathematics <br> Chemsitry </td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td style="border-bottom : none;">Open Course <br> Operations Research</td>
<td align="center" style="border-bottom : solid thin;">8.1</td>
<td align="center" style="border-bottom : solid thin;">19</td>
</tr>
<tr height="35px">
<td></td>
<td align="center" colspan="2" style="border : solid thin;">Semester wise SCPA</td>
</tr>
</table>
<table width="100%">
<tr>
</tr>
</table>
</body>
</html>
If you mean the border-bottom of main table then just set it's border-bottom:none; as below,
<table width="100%" border="1" rules="cols" style="border-collapse : collapse;border-bottom:none">
<tr>
<td align="center" width="54%" style="border : solid thin;">Courses</td>
<td align="center" width="23%" style="border : solid thin;">CGPA</td>
<td align="center" width="23%" style="border : solid thin;">Credit</td>
</tr>
<tr>
<td>English Language Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Additional Language Course<br> French</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Foundation Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Core Course<br>Physics<br> Physics</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Complementary Course(s) <br> Mathematics <br> Chemsitry </td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td style="border-bottom : none;">Open Course <br> Operations Research</td>
<td align="center" style="border-bottom : solid thin;">8.1</td>
<td align="center" style="border-bottom : solid thin;">19</td>
</tr>
<tr height="35px">
<td></td>
<td align="center" colspan="2" style="border-bottom:solid thin">Semester wise SCPA</td>
</tr>
</table>
<table width="100%">
<tr>
</tr>
</table>

HTML table fit cell height to contents valign top

I am trying to create a table where the left column is pushed top to fit its contents. Note that the right column requires to be height=300.
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
<tr>
<td valign="top" width="65%">
This is my 1st cell
</td>
<td valign="top" width="35%" height="300" rowspan="3" align="right">
This is long cell
</td>
</tr>
<tr>
<td valign="top" width="65%">This is my 2nd cell</td>
</tr>
<tr>
<td valign="top" width="65%">
This is my 3rd cell
</td>
</tr>
</table>
This is what I have come out so far: https://jsfiddle.net/5y33rtm3/1/
Desired outcome:
You can add rowspan="5" for the third row in the left:
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
<tr>
<td valign="top" width="65%">
This is my 1st cell
</td>
<td valign="top" width="35%" height="300" rowspan="7" align="right">
This is long cell
</td>
</tr>
<tr>
<td valign="top" width="65%">This is my 2nd cell</td>
</tr>
<tr>
<td valign="top" width="65%" rowspan="5"> <!-- CHANGED HERE -->
This is my 3rd cell
</td>
</tr>
</table>
or you can add height: 100% to it:
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
<tr>
<td valign="top" width="65%">
This is my 1st cell
</td>
<td valign="top" width="35%" height="300" rowspan="7" align="right">
This is long cell
</td>
</tr>
<tr>
<td valign="top" width="65%">This is my 2nd cell</td>
</tr>
<tr>
<td valign="top" width="65%" style="height: 100%"> <!-- CHANGED HERE -->
This is my 3rd cell
</td>
</tr>
</table>
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
<tr>
<td width="65%">
This is my 1st cell
</td>
<td valign="top" width="35%" height="300" rowspan="3" align="right">
This is long cell
</td>
</tr>
<tr>
<td valign="top" width="65%">This is my 2nd cell</td>
</tr>
<tr>
<td valign="top" style="height:100%" width="65%">
<img src="ant.jpg" style="height:40%;width:40%;" />
</td>
</tr>
</table>