<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>tabel布局</title>
</head>
<body style="margin: 0">
    <table style="background: green;height: 708px;width: 100%">
        <tr style="background: red"><td colspan="3" style="height: 10%;text-align: center;">    顶部        </td>        </tr>
        <tr style="background: #f7f7f7">
        <td style="width: 20%">

<ul style="list-style-type: none;">    
        <li><a href="http://www.baidu.com" target="myframe"><img src="0.jpg" height="50" width="100"></a></li>
        <li><a href="http://www.hao123.com" target="myframe"><img src="0.jpg" height="50" width="100"></a></li>
        </ul>

</td>

<td style="background: #f8f8f8" colspan="2">
            <iframe src="http://www.h123.com" name="myframe" width="100%" height="100%"></iframe>
        </td>
        </tr>
        <tr style="background: red"><td colspan="3" style="height: 10%;text-align: center;">底部</td></tr>
    </table>
</body>
</html>

转载于:https://www.cnblogs.com/houweidong/p/5837922.html

html5,表格与框架综合布局相关推荐

  1. html5表格两列合并_html多列布局

    在 html5 中,多列布局中列与列间距是什么属性 下面是属性,对比下 column-count 定义元素应该被分隔的列数 column-fill 定义列的填充方式 column-gap 定义列之间的 ...

  2. HTML4——框架与布局(基础)

    文章目录 iframe内联框架 table布局 div 元素的分类 通用属性 meta 元素 link元素 新增的布局标签(h5) header元素 footer元素 article元素 sectio ...

  3. HTML5 PC端框架

    HTML5  PC端框架 1.        Bootstrap Bootstrap是Twitter推出的一个开源的用于前端开发的工具包.它由Twitter的设计师Mark Otto和Jacob Th ...

  4. html框架有什么作用,使用HTML5+CSS+JS框架有那些好处

    使用HTML5+CSS+JS框架有那些好处 2017-12-08 相信很多程序猿朋友都用过框架,不过你是否知道你用的是HTML框架.CSS框架还是JS框架,其实这都不重要,重要的是使用框架的目的是什么 ...

  5. java web响应式框架_Web开发的十佳HTML5响应式框架

    HTML5框架是一类有助于快速轻松创建响应式网站的程序包.这些HTML5框架有着能减轻编程任务和重复代码负担的神奇功能.关于HTML5的框架种类繁多,并且很瘦欢迎,因为它能允许开发人员花费更少的时间和 ...

  6. html5 移动端单页面布局

    序      移动端的web网页使用的是响应式设计,但一般我们看到的网站页面都是跳转刷新得到的,比如通过点击一个menu后进入到另一个页面 今天来说下是移动端的单页面的布局.单页面就是一切操作和布局都 ...

  7. html5 跨屏框架,Amaze UI优秀案例:跨屏H5前端框架

    Amaze UI 自上线以来,从一个纯粹的基于HTML5的开源框架产品到拥有丰富Web 组件和模板,吸引了国内外众多开发者的关注.在Github上,Amaze UI已经收获将近3000个Star,并一 ...

  8. 掌财社:html5中AmazeUI框架中JS表单验证实战案例展示!

    今天和大家分享个有关于"html5中AmazeUI框架中JS表单验证实战案例展示!"这方面的相关内容知识,让大家对于html5中AmazeUI框架也可以有所了解! 1.需求 做一个 ...

  9. html5中制作表格,(html5表格的制作.doc

    (html5表格的制作 教学项目五 HTML中表格的制作 [教学内容] 讲解HTML中制作表格的标志 [教学目的] 使学生掌握简单表格的制作 [教学重点] 表格中单元格的合并操作 [教学难点] 理解属 ...

最新文章

  1. mysql more_mysql中哪种日志不能直接cat或more
  2. 谷歌甲骨文Java专利大战终审判决:安卓使用Java不构成侵权
  3. 优雅处理你的Java异常
  4. 5月22日阿里云网络变更公告
  5. python的c语言扩展方法简介
  6. fest556_AssertJ Fest Hamcrest
  7. leetcode - 279. 完全平方数
  8. 基础编程题目集 6-5 求自定类型元素的最大值 (10 分)
  9. 昇腾AI处理器软件栈--神经网络软件架构
  10. Overleaf 显示中文
  11. rpm deb命令集合
  12. 简述数学建模的过程_数学建模研究过程指导(精编版) Part IV
  13. 小米随身WiFi,Linux下AP热点驱动(开源)
  14. 中文手写输入法闪退问题
  15. 单片机流水单C语言程序,51单片机流水灯C语言源程序
  16. 台风怎么看内存颗粒_使用300多元的D4 16G内存是种什么体验
  17. C# 获取磁盘空间信息
  18. Postman团队协作开发
  19. char **argv什么意思呢
  20. vue3+setup写法

热门文章

  1. CentOS6下ssh简介及openssh的应用
  2. 读书笔记2013-1--暗时间(刘未鹏)
  3. 《精通J2EE网络编程》中讲的JNDI 6.2 使用JNDI
  4. 教你11 周打造全能Python工程师!
  5. java在文本区输出方法_Java文件的几种读取、输出方式
  6. MySQL高级 - 锁 - InnoDB行锁 - 总结
  7. 内存泄漏与内存溢出的区别
  8. 被丢弃的消息不能再次出现
  9. Elastic-Job中的DataFlowJob
  10. 上传问题分析1--文件保存位置