CSDN博客利用HTML标签制作美观表格

HTML代码:

<table>
	   <thead>
	          <tr>
			      <th align = "left" colspan = "5"><font size = 4 color = "Red">用于定义数据类型的关键字</font></th>
		      </tr>
	   </thead>
	   <tbody>
			   <tr>
					<td>class</td>
					<td>interface</td>
					<td>enum</td>
					<td>byte</td>
					<td>short</td>	
				</tr>
				<tr>
					<td>int</td>
					<td>long</td>
					<td><font size = 6 color = "FF00FF">float</font></td>
					<td>double</td>
					<td>char</td>	
				</tr>
				<tr>
				    <td>boolean</td>
				    <td>void</td>
				    <td bgcolor = "FF0000"></td>
				    <td></td>
				    <td></td>	
				</tr>		
	    </tbody>
	     <thead>
		        <tr>
				    <th align = "center" colspan = "5"><font size = 6 color = "Blue">用于定义流程控制的关键字</font></th>
			    </tr>
	    </thead>
	    <tbody>
				<tr>
					<td>if</td>
					<td>else</td>
					<td>switch</td>
					<td>case</td>
					<td>default</td>	
				</tr>
				<tr>
					<td>while</td>
					<td>do</td>
					<td>for</td>
					<td>break</td>
					<td>continue</td>	
				</tr>
				<tr>
					<td>return</td>
					<td></td>
					<td></td>
					<td></td>
					<td></td>	
				</tr>		
		</tbody>
		<thead>
			    <tr>
				    <th align = "right" colspan = "5"><font size = 4 color = "Green">用于定义访问权限修饰符的关键字</font></th>
				</tr>
	    </thead>
		<tbody>
			    <tr>
					<td>private</td>
					<td>protected</td>
					<td colspan = "2" bgcolor = "00FFFF">public</td>
					<td></td>
				</tr>
		</tbody>
		<thead>
				<tr>
					<th align = "left" colspan = "5"><font size = 4 color = "9F5F9F">用于定义类与类之间关系的关键字</font></th>
				</tr>
		</thead>
		<tbody>
				<tr>
					<td colspan = "2">extends</td>
					<td>implements</td>
					<td></td>
					<td></td>
				</tr>
				<tr>
					<td bgcolor = "Pink" rowspan = "2">合并两行</td>
					<td>2</td>
					<td>3</td>
					<td>4</td>
					<td>5</td>
				<tr>
					<td>2</td>
					<td>3</td>
					<td>4</td>
					<td>5</td>
				</tr>
		</tbody>
</table>

显示效果:

用于定义数据类型的关键字
class interface enum byte short
int long float double char
boolean void
用于定义流程控制的关键字
if else switch case default
while do for break continue
return
用于定义访问权限修饰符的关键字
private protected public
用于定义类与类之间关系的关键字
extends implements
合并两行 2 3 4 5
2 3 4 5

结合显示效果对比代码,就可以知道每种效果的写法。

对齐方式:

  • left 左对齐内容。
  • right 右对齐内容。
  • center 居中对齐内容。

合并单元格:

  • rowspan 合并行
  • colspan 合并列

字体font:

  • size 大小
  • color 字体颜色
  • bgcolor 单元格背景色

通过十六进制(Hex)的颜色值排序:

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/m0_46278037/article/details/113665288
今日推荐