Html5笔记 表格 布局

html>
<html lang="en">
<head><meta charset="UTF-8"><title>HTML5学习笔记title><style type="text/css">p{color: #ffff00;}body
        {margin: 0px;}#container
        {width: 100%;height: 950px;background-color: cornflowerblue;}#heading
        {width: 100%;height: 33%;background-color: #cccccc;}#content_menu{width: 30%;height: 57%;background-color: darkcyan;float: left;}#content_body{width: 70%;height: 57%;background-color: lightcoral;float: left;}#footing{width: 100%;height: 10%;background-color: #af845e;clear: both;}style>
head><body marginheight="0px" marginwidth="0px"><table width="100%" height="950px" style="background-color: #af845e"><tr><td colspan="2" width="100%" height="10%" style="background-color: darkorange"> 这是表头,colspan是合并单元格命令td>tr><tr><td width="33%" height="80%" style="background-color: darkseagreen">左菜单td><td width="33%" height="80%" style="background-color: darkgreen">右菜单td><td width="33%" height="80%" style="background-color: darkred"><ul><li>锦秋社区li><li>三号支沟li>ul>td>tr>table><div id="container"><div id="heading">头部div><div id="content_menu">内容菜单div><div id="content_body">内容主体div><div id="footing">底部div>divTestdiv><br/><br/><table border="1"><tr><td>表格1td><td>表格2td><td>表格3td>tr><tr><td>表格2td><td><ul type="square"><li><a href="http://www.baidu.com" >m1a> m1li><a name="internalLink">内联測试a><li>m2li><li>m3li><li><a href="#internalLink">转到上面的链接a> li>ul><p>以上是一个无序标签列表p><ol type="I" start="3"><li>Nikolaili><li>Soapli><li>Priceli>ol><div style="color: aqua">以上是有序列表div><ul><li>德拉格维奇li><ul><li>秘密电台li><li>古巴革命li>ul>ul><br/>以上是嵌套列表

                <dl><dt>使命6dt><dd>马卡洛夫与谢菲尔德之争dd><dt>使命8dt><dd>141大战马卡洛夫dd><dd>DeltaForce VS Makarovdd>dl><br/>以上是自己定义列表,即自己定义每一个条目的标识符

                <br/><a href="#internalLink">转到上面的链接a>td>tr>table>
body>
html>

转载于:https://www.cnblogs.com/claireyuancy/p/6876498.html


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部