html使用表格实现网页制作

最新推荐文章于 2025-03-20 08:39:54 发布

moon-start

最新推荐文章于 2025-03-20 08:39:54 发布

阅读量5k

点赞数 5

分类专栏： html 文章标签： html

本文链接：https://blog.youkuaiyun.com/longgejia/article/details/67069963

版权

这篇博客展示了如何使用HTML表格来构建一个完整的网页布局，包括logo、导航菜单、轮播图、热门和最新商品展示以及底部版权信息。通过嵌套表格实现了复杂的内容排列，是初学者学习HTML布局的实用教程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>网页首页</title>
	</head>
	<body>
		<table border="1" width="100%">
			<!--loge
				一行三列的表格-->
			<tr>
				<td>
					<table width="100%">
						<tr>
							<td>
								<img src="../img/logo2.png" height="40px" />
							</td>
							<td align="center">
								<img src="../img/header.jpg" />
							</td>
							<td align="right">
								<a href="#">登录</a>
								<a href="#">注册</a>
								<a href="#">购物车</a>     
						</tr>
					</table>
				</td>
			</tr>
			<!--菜单
				一行一列的表格-->
			<tr>
				<td bgcolor="black" height="40px">
					 <a href="#"><font color="white" size="4">首页</font></a> 
					 <a href="#"><font color="white" size="4">首页</font></a> 
					 <a href="#"><font color="white" size="4">首页</font></a> 
					 <a href="#"><font color="white" size="4">首页</font></a> 
				</td>
			</tr>
			<!-- 轮播图片 -->
			<tr>
				<td>
					<img src="../img/1.jpg" width="100%" />
				</td>
			</tr>
			<!-- 热门商品
				
				嵌套两行7列的表格 -->
			<tr>
				<td>
					<font size="6" face="微软雅黑">热门商品</font>

最低0.47元/天解锁文章