Html实例教程100例1.简单的html程序htmlheadtitle我的第一个HTML页面/title/headbodypbody元素的内容会显示在浏览器中。/pptitle元素的内容会显示在浏览器的标题栏中。/p/body/html2.简单的段落htmlbodyp这是段落。/pp这是段落。/pp这是段落。/pp段落元素由p标签定义。/p/body/html3.更多的段落!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.01Transitional//EN这个段落在源代码中包含许多行但是浏览器忽略了它们。/pp这个段落在源代码中包含许多行但是浏览器忽略了它们。/pp段落的行数依赖于浏览器窗口的大小。如果调节浏览器窗口的大小,将改变段落中的行数。/p/body/html4.诗歌问题htmlbodyh1春晓/h1p春眠不觉晓,处处闻啼鸟。夜来风雨声,花落知多少。/pp注意,浏览器忽略了源代码中的排版(省略了多余的空格和换行)。/p/body/html5.拆行htmlbodypTobreakbr/linesbr/inabr/paragraph,br/usethebrtag./p/body/html6.标题htmlbodyh1Thisisheading1/h1h2Thisisheading2/h2h3Thisisheading3/h3h4Thisisheading4/h4h5Thisisheading5/h5h6Thisisheading6/h6p请仅仅把标题标签用于标题文本。不要仅仅为了产生粗体文本而使用它们。请使用其它标签或CSS代替。/p/body/html7.居中排列的标题!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.01Transitional//EN=centerThisisheading1/h1p上面的标题在页面中进行了居中排列。上面的标题在页面中进行了居中排列。上面的标题在页面中进行了居中排列。/p/body/html8.水平线htmlbodyphr标签定义水平线:/phr/p这是段落。/phr/p这是段落。/phr/p这是段落。/p/body/html9.隐藏的注释htmlbody!--这是一段注释。注释不会在浏览器中显示。--p这是一段普通的段落。/p/body/html10.背景颜色htmlheadmetahttp-equiv=Content-Typecontent=text/html;charset=gb2312/metahttp-equiv=Content-Languagecontent=zh-cn//headbodybgcolor=yellowh2请看:改变了颜色的背景。/h2/body/htmlHTML文本格式化实例11.创建超链接htmlbodypahref=/index.html本文本/a是一个指向本网站中的一个页面的链接。/ppahref=本文本/a是一个指向万维网上的页面的链接。/p/body/html12.将图像作为超链接htmlbodyp您也可以使用图像来作链接:ahref=/example/html/lastpage.htmlimgborder=0src=/i/eg_buttonnext.gif//a/p/body/html13.在新的浏览器窗口打开超链接htmlbodyahref==_blankVisitW3School!/ap如果把链接的target属性设置为_blank,该链接会在新窗口中打开。/p/body/html14.链接到页面的不同位置htmlbodypahref=#C4查看Chapter4。/a/ph2Chapter1/h2pThischapterexplainsbablabla/ph2Chapter2/h2pThischapterexplainsbablabla/ph2Chapter3/h2pThischapterexplainsbablabla/ph2aname=C4Chapter4/a/h2pThischapterexplainsbablabla/ph2Chapter5/h2pThischapterexplainsbablabla/ph2Chapter6/h2pThischapterexplainsbablabla/ph2Chapter7/h2pThischapterexplainsbablabla/ph2Chapter8/h2pThischapterexplainsbablabla/ph2Chapter9/h2pThischapterexplainsbablabla/ph2Chapter10/h2pThischapterexplainsbablabla/ph2Chapter11/h2pThischapterexplainsbablabla/ph2Chapter12/h2pThischapterexplainsbablabla/ph2Chapter13/h2pThischapterexplainsbablabla/ph2Chapter14/h2pThischapterexplainsbablabla/ph2Chapter15/h2pThischapterexplainsbablabla/ph2Chapter16/h2pThischapterexplainsbablabla/ph2Chapter17/h2pThischapterexplainsbablabla/p/body/html15.跳出框架htmlbodyp被锁在框架中了吗?/pahref=/index.htmltarget=_top请点击这里!/a/body/html16.创建电子邮件链接htmlbodyp这是邮件链接:ahref=mailto:someone@microsoft.com?subject=Hello%20again发送邮件/a/ppb注意:/b应该使用%20来替换单词之间的空格,这样浏览器就可以正确地显示文本了。/p/body/html17.创建另一个电子邮件链接htmlbodyp这是另一个mailto链接:ahref=mailto:someone@microsoft.com?cc=someoneelse@microsoft.com&bcc=andsomeoneelse2@microsoft.com&subject=Summer%20Party&body=You%20are%20invited%20to%20a%20big%20summer%20party!发送邮件!/a/ppb注意:/b应该使用%20来替换单词之间的空格,这样浏览器就可以正确地显示文本了。/p/body/htmlHTML框架实例17.垂直框架htmlframesetcols=25%,50%,25%framesrc=/example/html/frame_a.htmlframesrc=/example/html/frame_b.htmlframesrc=/example/html/frame_c.html/frameset/html18.水平框架htmlframesetrows=25%,50%,25%framesrc=/example/html/frame_a.htmlframesrc=/example/html/frame_b.htmlframesrc=/example/html/frame_c.html/frameset19.如何使用noframes标签htmlframesetcols=25%,50%,25%framesrc=/example/html/frame_a.htmlframesrc=/example/html/frame_b.htmlframesrc=/example/html/frame_c.htmlnoframesbody您的浏览器无法处理框架!/body/noframes/frameset/html/html3.混合框架结构htmlframesetrows=50%,50%framesrc=/example/html/frame_a.htmlframesetcols=25%,75%framesrc=/example/html/frame_b.htmlframesrc=/example/html/frame_c.html/frameset/frameset/html20.含有noresize=noresize属性的框架结构htmlframesetcols=50%,*,25%framesrc=/example/html/frame_a.htmlnoresize=noresize/framesrc=/example/html/frame_b.html/framesrc=/example/html/frame_c.html//frameset/html21.导航框架htmlframesetcols=120,*framesrc=/example/html/html_contents.htmlframesrc=/example/html/frame_a.htmlname=showframe/frameset/html6.内联框架htmlbodyiframesrc=/i/eg_landscape.jpg/iframep一些老的浏览器不支持iframe。/pp如果得不到支持,iframe是不可见的。/p/body/html22.跳转到框架一个指定的节htmlframesetcols=20%,80%framesrc=/example/html/frame_a.htmlframesrc=/example/html/link.html#C10/frameset/html23.使用框架导航跳转至指定的节htmlframesetcols=180,*framesrc=/example/html/content.htmlframesrc=/example/html/link.htmlname=showframe/frameset/htmlHTML表格实例1.表格htmlbodyp每个表格由tab