网页设计基础5

向XHTML迈进HTML4.01规范在文件开始前必须指定文件类型!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.01Transitional//EN只有headbody才能直接包含在html里head内必须包含metatitle和stylebody内只能直接包含“区块型”标签（h1,p,...)“区块型”标签不能包含在“单行型”标签（a,img,q...)内列表标签（ul,ol)只能用于列表项（li）img标签必须包含alt属性HTML4.01规范htmlheadtitle欢迎来到美体小铺/title/headbodybgcolor=“tan”text=“black”p美体小铺fontface=“comicms”thebodyshop/font采用纯天然植物精致而成，绝不刺激皮肤，适合全家使用。/pulli茶树洁面胶li草莓身体滋养霜/ulpalign=left赶快来试一试吧。centerfontsize=“small”本页采用图片均来自网络，如有侵权将立即删去。/font/center/body/html课堂练习标准的HTML3.2标准的HTML4.01!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.01Transitional//EN欢迎来到美体小铺/titlemeta…/styletype=“”/style/headbodybgcolor=“tan”text=“black”p美体小铺fontface=“comicms”thebodyshop/font采用纯天然植物精致而成，绝不刺激皮肤，适合全家使用。/pulli茶树洁面胶/lili草莓身体滋养霜/li/ulpalign=left赶快来试一试吧。/ppcenterfontsize=“small”本页采用图片均来自网络，如有侵权将立即删去。/font/center/p/body/html标准的HTML4.01HTML3.2HTML4.01标签封闭性不严格要求，比如/li/p等可省略要求所有标签严格封闭字体的样式使用font的face,size,color等属性定义字体，大小，颜色等外观取消font标签,在CSS中定义字体样式对齐的方法使用centerpalign=“”定义对齐方式取消center标签和align属性，在CSS中定义对齐方式………………书上的代码基本上使用HTML3.2之前的规范书写，所以，不要学习书上的写法。与表格有关的标签•table……/table标示表格•th…/th是tablehead的缩写，标示表头•tr…/tr是tablerow的缩写，标示表格的一行•td…/td是tabledata的缩写，标示表格内的数据.例姓名性别年龄张三男18李四女20表头tableheadth/th数据Tabledatatd姓名/tdtd性别/tdtd年龄/td表格的行,tablerowtr/trtd张三/tdtd男/tdtd18/tdtrtd李四/tdtd女/tdtd20/td/trtable/table适合版本HTTP地址FTP地址Windows://://://写出该表格的HTML代码sup标签•sup……/sup用于标示上标•它是英文super-scriptedtext的缩写X2飘柔Xsup2/sup飘柔supimgsrc=“reg.gif”alt=“注册商标”/supsub标签•sub……/sub用于标示下标•它是英文sub-scriptedtext的缩写￥39.99￥39.sub99/subX1+Y2=1503网页上显示这个方程式Xsub1/sub+Ysub2/subsup3/sup=15带“x”是很酷的men-X-MENfile-X-FileHTML-X-HTML猜一猜HTML与XHTML的关系什么是XHTMLXHTML=eXtensiblehtml,可扩展的htmlHTML4.01定义的标签（e.g.body,p,a)是有限的，而XHTML允许使用XML的名字空间定义额外的标签（e.g.数学符号等），也就是说，XHTML可以定义无限的标签。我们已经有html4.01了，真的还需要xhtml吗？网页上显示费马小定理np-1≡1modp，如n⊥p!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.01Transitional//EN费马小定理/titlemeta…/styletype=“”/style/headbodypnsupp/sup-1imgsrc=“”alt=“”/1 mod p,如nimgsrc=“”alt=“”/p/p/body/html但是这样的写法不能表达定理本身的含义只是一串字符的序列!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.01Transitional//EN费马小定理/titlemeta…/styletype=“”/style/headbodymathxmlns=≡/momn1/mnmimod/mimip/mi/math/body/html网页上显示费马小定理np-1≡1modp，如n⊥p显然，需要扩展HTML标签集合来满足某些特殊符号，HTML4.01无法做到，需要使用XHTML来完成。XHTML包含的标签数量是传统HTML标签的一部分XHTML又可以利用XML语法来定义额外的标签多浏览器使用者－“XHTML具有严格语法，并保证网页在不同浏览器下具有相同样式”高校数学教授－“XHTML能够对现有的HTML标签进行扩展（e.g.新增某些数学符号），这对我们来说很重要”手机生产商－“XHTML正成为一种被浏览器，移动设备和手机广泛支持的语言”网页设计者－“我喜欢跟进最新的IT技术，XHTML保证了这些技术在浏览器上能实现”图书管理员－“XHTML具有XML所具有的优势（e.g.保存大型结构化文件），同时有具有HTML的优势（e.g.使用CSS控制外观）”数据库工程师－“目前许多数据库使用XML编写，这种格式的数据更容易被转换成XML格式”从HTML4.01向XHTML迈进第一步设置文件类型!DOCTYPEhtmlPUBLIC“//W3C//DTDXHTML1.0Strict//EN”“”启动InternetExplorer浏览器.lnk第二步在html内添加相关属性htmlxmlns=””lang=”en”xml:lang=”en”第三步将所有标签闭合html4.01brimgsrc=”1.jpg”alt=”dog”xhtmlbr/imgsrc=”1.jpg”alt=”dog”/!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.01Transitional//EN=content-typecontent=text/html;charset=gb2312title/titlestyletype=/style/headbodypimgsrc=image/bodyshop_p1.jpgalt=/pphtml的发展经历了几个重要阶段：/ppimgsrc=image/history.gifalt=/pulli1995html3.0/lili1999html4.01/li/ul/body/html标准的HTML4.01标准的XHTML1.0!DOCTYPEhtmlPUBLIC“//W3C//DTDXHTML1.0Strict//EN”“”htmlxmlns=””lang=”en”xml:lang=”en”headmetahttp-equiv=content-typecontent=text/html;charset=gb2312/title/titlestyletype=/style/headbodypimgsrc=image/bodyshop_p1.jpgalt=//pphtml的发展经历了几个重要阶段：/ppimgsrc=“image/history.gif”alt=“”//pulli1995html3.0/lili1999html4.01/li/ul/body/html参考答案XHTML1.0手册将文件类型设置为xhtml,否则浏览器认为你的网页是其他标准将xmlns,lang,和xml:lang三个属性添加到html标签内所有标签均小写所有标签必须闭合课后作业•1.解释一下标签的含义（用途）•table…/table•th…/th•tr…/tr•td…/td•sub……/sub•sup……/sup•2.在作业本上抄写从HTML4.01到XHTML1.0的三步骤。上机•实验5-见课程网站提示：实验5作为”单元测试一”将计入期末总成绩，所有同学均要测试检查,请大家认真对待!questions?