各种定位代码.docx

欢迎您！启步学代码。（供初学HTML代码的朋友参考）定位插入的各种代码　　 页面上要在那一个位置插入文字或图片等内容，有三种方法：第一，是定位标签．第二，是用表格多行多列，在单元格内插入内容．第三，是html标签行内套用css语句，设置绝对定位加叠内容．先学习第一种方法定位标签．　 定位标签有二种属性内容及属值：　 定位标签属性内容：水平方向（align）和垂直方向（valign）．　 水平方向align有三种属值：left（左对齐），center（居中），right（右对齐）．　垂直方向valign有二种属值：top（靠顶），bottom（靠底）。定位标签模式：DIV 属性内容=属值定位标签模式1/DIVp属性内容=属值定位标签模式2/p水平方向即左中右的示例：文字左对齐的代码：p align=leftfont style=font:15pt face=黑体 color=0000ff文字左对齐的标签:p align=left/font/P显示结果：文字左对齐的标签:p align=left文字居中的代码：p align=centerfont style=font:15pt face=黑体 color=0000ff文字居中的标签:p align=center/font/P　还有下面两条居中标签：CENTER居中标签/CENTERDIV align=center居中标签/DIV显示结果：文字居中的标签:p align=center文字右对齐的代码：p align=rightfont style=font:15pt face=黑体 color=0000ff文字右对齐的标签:p align=right/font/P显示结果文字右对齐的标签:p align=right垂直方向即靠顶和靠底的示例：　　垂直方向定位靠顶或靠底，可以结合水平方向左中右，构成六种位置指令．代码必须加在表格的列标签d中，才有效．一个单元格中只能执行一条指令.　代码模式：　　TD align=LEFT valign=top　◆TD 水平方向=左 垂直方=顶　（一）　靠顶top的不同水平位置代码：TD align=LEFT valign=top居左靠顶TD align=center valign=top居中靠顶TD align=right valign=top居右靠顶　（二）　靠底bottom的不同水平位置代码：TD align=LEFT valign=bottom居左靠顶TD align=center valign=bottom居中靠顶TD align=right valign=tbottom居右靠顶不同位置插入文字的实例 （一）　　练习做生日图片．设置一张有鲜花作背景的图框，表格分拆为上中下三个单元格，边框粗度设为0. 第一单元格插入的文字靠顶居左；第二单元插入的文字居中；第三单元格插入的文字靠底居右．代码如下：p align=centertable border=0width=640cellspacing=1cellpadding=10height=330id=table1background=/5/JPEG640/091/051_100/DT099_L.jpgtrtd align=LEFT valign=top height=50FONT style=FONT-SIZE: 25ptface=华文行楷 color=#00ff00Bp送给春兰妹妹/B/FONT/Pbr/td/trtrtd align=center height=200FONT style=FONT-SIZE: 46ptface=华文行楷 color=#ffff00B祝你生日快乐！/B/FONT/P/td/trtrtd align=right valign=bottom height=80FONT style=FONT-SIZE: 25ptface=华文行楷 color=#00ff00B大姐冬梅bB/FONT/td/tr/table/P说明：　◆p align=center居中标签．　◆table border=0.....cellpadding=10表格标签，用鲜花图片作背景．　◆td valign=top height=130第一单元格．加入居左靠顶语句．　◆td align=center height=200第二单元格．加入居中语句．　◆td align=right valign=bottom height=80第三单元格．加入居右靠底语句．　◆/td/tr/table/P表格和图片居中代码的尾标签．注：这种多元格表格，边框虽设定为零，但有一些论坛发表时，仍显示出单元格分隔线，用下面不设多元格的方法，也可达到相仿的效果．p align=centertable border