如何使用HTML布局web页面?(代码示例)
程序员文章站
2022-03-18 09:34:25
...
本篇文章给大家带来的内容是介绍如何使用HTML布局web页面?(代码示例)。有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。
一, 效果图。
二,代码。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>html 列表</title> </head> <body> <!--使用div元素的网页布局--> <div id="container" style="width:500px"> <div id="header" style="">> <h1 style="margin-bottom:0">main title o f web page</h1> </div> <div id="menu" style="height:200px;width:100px;float:left"> <b>menu</b> <br> html <br> css <br> javascript </div> <div id="content" style="height:200px;width:400px;float:left"> ontent goes here </div> <div id="footer" style="clear:both;text-align:center"> Copyright © W3CSchool.cc </div> <!--使用table元素的网页布局--> <table width="500" border="0"> <tr> <td colspan="2" style="">> <h1>main title of web page</h1> </td> </tr> <tr> <td style="width:100px"> <b>menu</b> <br>html <br>css <br>javascript</td> <td style="height:200px;width:400px"> content goes here</td> </tr> <tr> <td colspan="2" style="text-align:center"> Copyright © W3CSchool.cc</td> </tr> </table> </body> </html>
参考资料:《菜鸟教程》
以上就是如何使用HTML布局web页面?(代码示例)的详细内容,更多请关注其它相关文章!
上一篇: 【数据结构与算法】—— 二分查找
下一篇: css怎么设置字体居中?
推荐阅读
-
使用html2canvas.js实现页面截图并显示或上传的示例代码
-
页面代码 Embed用法。Embed如何用?_html/css_WEB-ITnose
-
HTML??使用表格就行页面布局_html/css_WEB-ITnose
-
如何使用SVG生成超酷的页面预加载素描动画效果_html/css_WEB-ITnose
-
如何在静态页面上显示网页代码 并且高亮 就像图中的这样_html/css_WEB-ITnose
-
页面代码 Embed用法。Embed如何用?_html/css_WEB-ITnose
-
html如何实现页面上传图片并且能进行展示的示例代码分享
-
html如何实现页面上传图片并且能进行展示的示例代码分享
-
div+css网页布局(示例代码)_html/css_WEB-ITnose
-
如何使用SVG生成超酷的页面预加载素描动画效果_html/css_WEB-ITnose