一、经典作品如是说
HTML示例页面标识符, 本示例适合于算数HTML的老师。该示例里头有增设了css的式样增设，有div的式样新格局，那个示例较为全面性，有利于老师的自学,责任编辑将如是说怎样透过Cubzac结构设计对个人中文网站并将其切换为标识符的操作过程来课堂教学结构设计。
二、经典作品效用
音频模拟
https://live.csdn.net/v/embed/240037
(title-I81JP-我的网志（5页）)]
截屏模拟
三、 经典作品标识符
隣HTML标识符
<!DOCTYPE htmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html; charset=utf-8" /><title>主页</title><linkhref="css/style.css"rel="stylesheet"type="text/css" /></head><body><!-----颈部已经开始-------><divclass="top"><ahref="index.html"><imgsrc="images/banner.gif" /></a></div><!---nav已经开始----><divclass="daohang"><divid="nav"><ul><liclass="hot"><ahref="index.html">主页</a></li><li><ahref="rizhi.html">日志</a></li><li><ahref="xiangce.html">相册</a></li><li><ahref="liuyan.html">留言板</a></li><li><ahref="guanyu.html">关于我</a></li></ul><divclass="sousuo">站内搜索<divid="box"><inputtype="text"name="search" ><divid="search">搜索</div></div></div></div></div><!---nav结束----><!-----颈部结束-------><!-----main已经开始-------><divclass="main"><divclass="left" ><divclass="tit">>>关于我</div><imgsrc="images/109395CF4-7.jpg"width="193px"height="242px" /><divclass="minz"><imgsrc="images/girl.gif" />张梅 </div><p>重庆市 南岸区 </p><divclass="duanlu">天微明，冬天的光透过窗，印在左手的无名指上。 回忆的颜色是透明的冷，于是，用窗口透入的薄薄的光暖一暖心。</div></div><divclass="right"><divclass="box1"><divclass="tit"> >>日志</div><ul><li><p>IMAX加长版《变形金刚》（Transformers）亲历简报</p><span>2007-09-25</span></li><li><p>《变形金刚》发烧友的看图说话（多图）</p><span>2007-09-22 10:13</span></li><li><p>《反恐王国》（The Kingdom）：生猛的空心弹 </p><span>2007-09-22 08:03</span></li><li><p>《东方承诺》（Eastern Primises）：不动如山，暗流汹涌</p><span>2007-09-20 11:07</span></li><li><p>《妖精的旋律》（Elfen Lied）：日式YY的经典案例</p><span>2007-09-20 10:44</span></li></ul></div><divclass="box2"><divclass="tit"> >>相册</div><imgstyle="margin-left:8px;"src="images/1.jpg"width="175px"height="188px" /><imgsrc="images/2.jpg"width="175px"height="188px" /><imgsrc="images/3.jpg"width="175px"height="188px" /></div></div></div><!-----main结束-------><!-----bottom已经开始-------><divclass="bottom"><divclass="bottom-box"><p>BLOG公司版权所有 1997-2010 </p></div></div><!-----bottom结束-------></body></html>CSS标识符
@charset"utf-8";/* CSS Document */body{ margin:0 auto; font-size:12px; font-family: "宋体",arial; line-height:22px; }div,p,input,ul,li,p,h1,h2,h3,h4,h5,h6,dl,dt,dd{ height:auto; margin:0;; padding:0; vertical-align:middle ;}li{ list-style:none;}a{ text-decoration:none;}.ul{ list-style:none;}.divclear{ clear:both;}img{ border:0; margin:0; padding:0;}a{color:#333;}a:link{ color:#333;}a:hover {color:#629705;text-decoration:none;overflow:hidden;}/*---页面已经开始-----*//*---top已经开始-----*/.top{ height:255px; width:950px; margin:0 auto; }/*---top结束-----*//*---导航----*/.daohang{ width:950px;height: 47px;background: url(../images/navbg.gif) repeat-x;margin: 0 auto;}#nav{ width:950px; height:40px; line-height:40px; font-family:"微软雅黑"; font-weight:bolder; font-size:14px; margin:0 auto; }#navul{ margin:0 auto; margin-left:20px;width: auto;float: left; }#navli{float: left;text-align: center;color: #f2ecec;}#nava{width:60px;height:40px;padding:0px10px; display:block; font-family:"微软雅黑"; font-size:14px; font-weight:bold; float:left;}#nava:link { color:#016941; }#nava:visited{ color:#016941; text-decoration:none; overflow:hidden; }#nava:hover { color: #016941; text-decoration:none; overflow:hidden; background: url(../images/navbghover.gif) repeat-x; }#nava:active { color: #016941; text-decoration:none; overflow:hidden; background:url(../images/navbghover.gif) repeat-x; }.hot{ background:url(../images/navbghover.gif) repeat-x;}.sousuo{ width:270px; height:40px; float:right; margin-right:40px;color: #016941;}#box{font-size: 14px;float: right;margin-left: 5px;margin-top: 10px; }input{width: 155px;height: 20px;float: left;border: #4343441px solid; }#search{height: 20px;float: right;cursor: pointer;background: #016941;width: 37px;margin-left: 2px;line-height: 20px;color: #fff;font-weight: normal;text-align: center;font-size: 12px; }.main{ width:950px; height:auto; overflow:hidden; border:#fceaa91px solid; margin:0 auto; border-bottom:none;}.main2p{ padding:0px20px;}.main.left{ width:320px; padding:0px25px; height:465px; float:left; text-align:center;}.main.left.tit{ width:312px; height:40px; line-height:50px; border-bottom:#9331px solid; font-weight: bolder; font-size:14px; text-align:left; margin-bottom:10px;}.minz{ width: 50px;height: 40px;line-height: 40px;margin: 0 auto; margin-top:10px;}.minzimg{ float: left;margin-top: 12px;}.main.right{ width:580px; height:465px; float:left;}.box1{ width:558px; height:183px; border:#cccc991px solid; margin-top:10px;}.box1.tit{ width:100%; height:33px; background:#cccc99;font-weight: bolder; font-size:14px; line-height:33px;}.box1ul{ margin:0px12px; width:530px;}.box1ulli{ width:510px; border-bottom:#0001px dashed; padding-left:20px; height:27px; line-height:27px; background:url(../images/ico4.gif) no-repeat 0px2px;}.box1ullip{ width: 80%;float: left;}.box1ullispan{ width:20%;}.duanlu{ color:#990000; text-align:left;letter-spacing:5px; margin-top:15px;}.box2{ width:558px; height:250px; border:#cccc991px solid; margin-top:8px;}.box2.tit{ width:100%; height:33px; background:#cccc99;font-weight: bolder; font-size:14px; line-height:33px; margin-bottom:15px;}.box2img{ float:left; margin-right:8px;}.biaoti{ font-size:14px; width:100%; height:50px; line-height:50px; font-weight:bolder; text-align:center;}.xiangce{ width: 940px;height: 500px;}.xiangceul{ }.xiangceulli{ width: 290px;float: left;padding: 10px;text-align: center; }.xiangceulliimg{ width:210px; height:240px;margin:10px0px;}/*---bottom结束-----*/.bottom{ width: 950px;margin: 0 auto; height:54px; background:url(../images/footer.gif) no-repeat;}.bottomp{ height: 54px;text-align: center;float: left;width: 100%;line-height: 80px;}.mianb{ width:100%; height:30px; background:#ffffdb; text-align:right; line-height:30px;}.danye{color: #666;font-size: 14px;line-height: 25px; width:700px; margin:0 auto;}.main3 { width:60%; margin:0 auto; min-height:400px;}.main3p{ text-align:left; margin:10px0px;}/*---bottom结束-----*/四、更多源码
【干货分享】自学编程的小伙伴可以前往我的 gitee 仓库（持续更新中...）
【web自学指南】从web基础、计算机基础到前端常用框架的讲义，涵盖前端大部分必备知识（自学指南 + 技术文章 + 资源分享）
源码下载: 36539后面还有2777
举报/反馈
我们凭借多年的网站建设经验，坚持以“帮助中小企业实现网络营销化”为宗旨，累计为4000多家客户提供品质建站服务，得到了客户的一致好评。如果您有网站建设、网站改版、域名注册、主机空间、手机网站建设、网站备案等方面的需求...
请立即点击咨询我们或拨打咨询热线： ，我们会详细为你一一解答你心中的疑难。项目经理在线
请立即点击咨询我们或拨打咨询热线： ，我们会详细为你一一解答你心中的疑难。项目经理在线
客服1