html标记学习(符合xhtml标准的标记)

XHTML标记详解

最新推荐文章于 2021-06-25 20:52:04 发布

原创最新推荐文章于 2021-06-25 20:52:04 发布 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#xhtml #html #class #border #javascript #浏览器

HTML和WEB 专栏收录该内容

46 篇文章

订阅专栏

本文详细介绍了符合XHTML标准的各种HTML标记用法，包括文本格式化、表单元素、图像映射、选择器、表格结构等内容，并通过实例展示了如何正确使用这些标记。

html标记学习(符合xhtml标准的标记)

tt,kbd等宽,

sup+sub,

select+option+optgroup,

noscript,

img.usemap="#编号"+map+area,

fieldset+legend+ul列表,

label.for,

ins,del,i,em,big,b,address,acronym,dfn,code,cite,

center,

table全套系列:table+label+col+colGroup+thead+tbody+tfood+tr+th+td

<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" /> <title>hello</title> <mce:style type="text/css"></mce:style><style type="text/css" mce_bogus="1">body{ font-size:13px; background-color:#141; } #page{ width:360px; margin:0 auto; background-color:white; min-height:240px; padding:10px; } .block1{border:1px solid #fcc; padding:10px; margin-bottom:10px;}</style> </head> <body> <div id="page"> <div class="block1">  请计算： <tt style="background-color:#eee; display:block;" mce_style="background-color:#eee; display:block;"> ax<sup>2</sup>+bx+c<sub>3</sub>=0 </tt>  <kbd>abcdfeg1234567890hijklmnopqrstuvwxyz</kbd> </div> <div class="block1"> <select> <option>请选择...</option> <optgroup label="亚洲"> <option>中国</option> <option>日本</option> <option>韩国</option> </optgroup> <optgroup label="北美洲"> <option>美国</option> <option>加拿大</option> </optgroup> <optgroup label="欧洲"> <option>大不列颠王国</option> <option>法兰西</option> <option>德意志</option> </optgroup> <option>你选完了吗？</option> </select> </div> <div class="block1"> <div style="width:240px;float:right;"> <mce:script type="text/javascript" language="javascript"></mce:script> <noscript> 你的浏览器不支持客户端脚本，请你砸了它！ </noscript> </div> <div style="clear:both;" mce_style="clear:both;" ></div> </div> <div class="block1"> <img id="imgMap" src="http://www.google.com/intl/en_ALL/images/logo.gif" mce_src="http://www.google.com/intl/en_ALL/images/logo.gif" usemap="#map" alt="" width="276" height="110" style="border:0px;" mce_style="border:0px;" /> <map id="map"> <area shape="rect" mce_shape="rect" coords="0,0,82,106" mce_coords="0,0,82,106" href="#none" mce_href="#none" /> <area shape="circle" mce_shape="circle" coords="90,58,3" mce_coords="90,58,3" href="#none" mce_href="#none" /> <area shape="poly" mce_shape="poly" coords="221,34,238,37,257,32,278,44,284,60,253,89,237,81,229,64,228,54" mce_coords="221,34,238,37,257,32,278,44,284,60,253,89,237,81,229,64,228,54" href="#none" mce_href="#none" /> </map> </div> <div class="block1"> <fieldset style="width:160px; padding:0;"> <legend>爬山</legend> <ol> <li>黄山</li> <li>峨眉山</li> <li>长白山</li> </ol> </fieldset> </div> <div class="block1"> <label for="txtName">请输入姓名：</label><input type="text" id="txtName" /> </div> <div class="block1"> <ins datetime="1997-10-01T12:15:30-05:00">此文本已被插入。</ins> <del>此文本已被删除。</del> <i>指定文本应以斜体渲染，若可用的话。</i> <em>强调文本，通常以斜体渲染。</em> <span style="font-size:13px;" mce_style="font-size:13px;">此文本将加<big>大</big>显示。</span> 中<b>国</b>人. <address>特定信息，如地址、签名、作者、此文档的原创者。</address> <acronym>winxp windows 7</acronym> </div> <div class="block1"> <dfn>HTML 代表超文本标记语言。</dfn> <code>这里是以小型abcdefghijklmnopqrstuvwxyz1234567890固定宽度hello字体显示的文本。</code> <cite>书的标题。</cite> <center>将后面的文本和图像居中显示。</center> </div> </div> </body> </html>

效果图