html标签应用.doc

1关于简单的标签 HTML是超文本标记语言，用来制作静态网页 !DOCTYPE html html head meta charset=UTF-8 title/title /head body h1font size=12 face=微软雅黑 color=redhelloworld/font/h1 pfont size=6 color=red xx鸡排/fontbr ///块级标签 font描述字体 炸鸡 nbsp;| nbsp;烤串 nbsp;|nbsp;烤鱿鱼br / copyright copy;2007quot;xx炸鸡quot;ALL RIGHT; /p /body /html 2标签 !DOCTYPE html html head meta charset=UTF-8 title/title style .box{width: 200px;height:400px;} .top{width: 200px;height: 200px;} .bottom{width: 200px; height: 200px;} /style /head body h1font color=red size=6我们看到了什么/font/h1 div class=box div class=top img src=img/IMG_7611.PNG align=textbottom width=90% height=100%/ 底/div div class=bottom img src=img/IMG_7611.PNG align=texttop width=90% height=100%/顶/div /div /body /html html head meta charset=utf-8 / title/title /head body pimg src=img/IMG_7611.PNG width=250px height=300px alt=美女 底部对齐/pbr ///块级元素 img src=img/IMG_7611.PNG width=250px height=300px/font style=vertical-align: top;顶部对齐/font pre预格式化文件/pre ol//有序标签 li苹果/li li李子/li li荔枝/li li梨/li /ol ul//无序标签 li肉： ul type=square li羊肉/li li鸡肉/li li牛肉/li li猪肉/li /ul /li /ul /body /html 关于绝对路径与相对路径 ../跳出当前文件夹 标签的属性 html head meta charset=UTF-8 title/title /head body a href=#helpme锚标记/a pa name=helpme这是标记，快速找到相当于书签/a/p a href=mailto：www.12306@qq邮箱/a!--电子邮件链接-- marquee scrolldelay=90 水平滚动/marquee!--表示滚动延迟时间，默认值为90表示滚动的方向，默认为从右向左-- marquee scrolldelay=200 direction=up onmouseover=this.stop() onmouseout=this.start() align=center 一只小小鸟/marquee /body /html 3 表格 html head meta charset=utf-8 / title/title /head body table border=1 cellspacing=0 cellpadding=0 bordercolor=red//表格设定好了几行几列之后就不能在增加行列能合并 tr align=center //tr设置居中全部居中改变样式 td img src=img/IMG_7612.png width=50px height=50px//td td colspan=3肉类食品/td//跨3列 td colspan=3蔬菜食品/td /tr tr align=center td rowspan=3菜品种类/td//都在td上操作合并第一个td把后面的都撑开了 td rows