05 html表格菜谱页面练习

没有给表格指定宽度、高度它就自适应。

clospan:跨多列

rowspan:跨多行

<html>
<head>
<title>菜谱</title>
</head>

<body>
<table border=1px bordercolor=#72256B align=‘center‘ cellspacing=0px cellpadding=5px height=180 width=400px>
<tr align=‘center‘><th colspan=3 >南区食堂菜谱</th></tr>
<tr align=‘center‘><th rowspan=2 >素菜</th><td>红烧茄子</td><td>炝炒绿豆芽</td></tr>
<tr align=‘center‘><td>酸辣土豆丝</td><td >炒上海青</td></tr>
<tr align=‘center‘><th rowspan=2>荤菜</th><td>冬瓜肉片</td><td>西湖醋鱼</td></tr>
<tr align=‘center‘><td>红烧肉<br/><img src="meat.jpg" width= 100px ></td><td>小鸡炖蘑菇</td></tr>
</table>
</body>
</html>

运行效果图

时间: 2024-11-05 14:00:20

05 html表格菜谱页面练习的相关文章

利用表格布局页面

利用表格布局页面的操作流程: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv

Word:表格在页面中垂直居中

如何让表格在页面上垂直居中呢.想当然的认为这属于表格的设置,在表格属性和其它表格相关选项中一通猛找,最后发现不在这里. 1)运行环境:Win7 + Word 2007 2)选择"页面布局>>页面设置" 3)在弹出的页面设置对话框中,找到"版式>>页面>>垂直对齐方式",然后选择"居中" 原文地址:https://www.cnblogs.com/pandabang/p/8457820.html

关于使用表格制作页面

在HTML中,表格的功能挺强大的.表格由 <table> 标签以及一个或多个 tr.th或td 元素组成.单元格可以包含文本.图片.列表.段落.表单.水平线.表格等等.所以,我们可以利用表格来制作一个网页页面.我在做相关练习时发现,若单单使用表格来进行页面的制作,是存在一定的困难.当然现在我们可以利用css来轻松布局.在用表格制作网页时,需要明确的是整个网页中,应该如何划分表格.哪些地方可以直接用一个表格表示,或者哪些地方需要将单元格合并才达到效果.有了清晰的思路后,做起来才不会乱套. 我在利

HTML——使用表格进行页面布局

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

html5: table表格与页面布局整理

传统表格布局之table标签排版总结: 默认样式: <style> table { max-width: 800px; border-spacing: 2px; border-collapse: initial; } table td { padding: 10px; min-width: 50px; box-sizing: border-box; } </style> 1. 基本表格(双线表格) table标签内添加border属性:border="1",va

MySQL中表格各页面的注意和操作项

05:表格与列表

列表 表现1 <ul> <li>1111</li> <li>2222</li> <li>3333</li> </ul> 表现2 <ol> <li>内容1</li> <li>内容2</li> <li>内容3</li> </ol> 表现3 <dl> <dt>tttt</dt> <

在ASP.NET Web Forms中使用页面导出伪xls Excel表格

将数据导出为Excel表格是比较常见的需求,也有很多组件支持导出真正的Excel表格.由于Excel能打开HTML文件,并支持其中的table元素以及p之类的文本元素的显示,所以把.html扩展名改为.xls是比较常用的一种方式.当然这只是一种骗人的伎俩,所以我称之为伪xls表格.不过对于要求不高的需求,这种方法还是比较简单快捷的. 在Web Forms项目中,除了用代码拼凑HTML元素标记外,还可以直接用窗体页面渲染HTML表格.Web Forms就是用来渲染动态HTML的,直接利用它,支持代

前端页面表格实现合并单元格

做报表,查询的时候,经常用到表格. 页面展示多条数据时,时常表格的第一列都是相同的,所以合并单元格,让表格看起来更直观. 写这个函数,其它js里面直接调用unionTab (tb,collength);其中第一个参数tb为表格ID,第二个参数为你想要进行单元格合并的表格列数. 缺点:只能实现前N列,不能实现某一列实现合并. /**/ window.unionTab = function (tb, colLength) { var id = tb; tb = $("#" + tb).ge