天涯部落

小圈子,大声音!呼朋引伴网聚部落!

创建新部落?

从零启步学代码【三】

楼主:人间惆怅客SD 时间:2012-09-10 23:26:03 点击:612 回复:8
脱水模式给他打赏只看楼主 阅读设置
此帖绝对不能点击“编辑”“不能编辑”两个按钮。否则,帖子中的示范代码就没有了,只剩下效果了。切记!!!


 

欢迎您!启步学代码


 


(原创编辑:游子。 供初学HTML代码的朋友参考)



文字显示位置的控制

文字显示位置分别为:

水平方向(align),垂直方向(valign)
水平方向即左中右:
left(左对齐)
center(居中)
RIGHT(右对齐)

垂直方向即靠顶和靠底.

top(靠顶)、bottom(靠底)等。



水平方向即左中右的代码:





<p align=left><font style=font:15pt face=黑体 color=fff000>向左对齐</font></P>

<p align=CENTER><font style=font:15pt face=黑体 color=fff000>表示居中</font></P>

<p align=RIGHT><font style=font:15pt face=黑体 color=fff000>向右对齐</font></P>



原创编辑:游子。

 

 



显示效果如下:

向左对齐



表示居中



向右对齐


 



实例:





送给春兰妹妹



祝你生日快乐!




大姐冬梅
20060228


实例代码:





<CENTER>
<TABLE width=480 height=320 bordercolor=olive background=http://img3.laibafile.cn/p/l/116936644.jpg border=18>
<TBODY>
<TR>
<td align=center valign=top><br>
<FONT style="FONT-SIZE: 25pt" face=华文行楷 color=#ff00ff><B>
<p align=left>送给春兰妹妹</P><br>
<p align=CENTER>祝你生日快乐!</P><BR><BR>
<p align=RIGHT>大姐冬梅<br>20060228</P>
</B> </FONT>
</TD></TR></TOBDY></TBODY></TABLE></CENTER>


原创编辑:游子。

 

 




垂直方向valign)靠顶的代码:
<TD align=LEFT valign=top>居左靠顶</TD>
<TD align=center valign=top>居中靠顶</TD>
<TDalign=RIGHT valign=top>居右靠顶</TD>

垂直方向valign)靠底的代码:

<TD align=LEFT valign=bottom>居左靠底</TD>
<TD align=center valign=bottom>居中靠底</TD>
<TD align=RIGHT valign=bottom>居右靠底</TD>



   文字输出位置垂直方向的代码是设置在一张空表格的单元格里(TD)和(/TD),方便易用。实例如下:




居左靠顶的代

align=LEFT valign=top

居中靠顶的代码

align=center valign=top

居右靠底的代码

align=RIGHT valign=bottom


代码:




<BR>
<CENTER>
<TABLE width=480 height=320 bordercolor=olive background=http://img3.laibafile.cn/p/l/116936645.jpg border=18>
<TR>
<TD>
<TABLE width=460 height=320 bordercolor=olive border=0>
<TR>
<TD align=LEFT valign=top height=80><FONT style="FONT-SIZE: 12pt" face=黑体 color=#fff000><B>
居左靠顶的代码<BR><h3>align=LEFT valign=top</h3></B> </FONT></TD></TR>
<TR>
<TD align=center valign=top height=160><FONT style="FONT-SIZE: 12pt" face=黑体 color=#fff000><B>
居中靠顶的代码<BR><h3>align=center valign=top</h3></B> </FONT></TD></TR>
<TR>
<TD align=RIGHT valign=bottom height=80><FONT style="FONT-SIZE: 12pt" face=黑体 color=#fff000><B>
居右靠底的代码<BR><h3>align=RIGHT valign=bottom</h3></B> </FONT>
</TD></TR></TABLE>
</TD></TR></TABLE></CENTER>


  【 说明】
  ◇垂直方向设置必须在表格的单元格里(TD)和(/TD)。
  ◇本实例在图框内插入一张空表格,分为三横排。
  ◇根据各行插入内容设置高度。
  ◇在一张表格中,设置每一行的关键语句。
  行的开始标签:
<TR>
<TD align=center valign=top height=160>
插入内容
  行的结束标签:
</TD></TR>



原创编辑:游子。

 

 



文字(或图片)放置的地位,
还可以用空格(&nbsp;)和空行(BR)调整;
用代码编辑绝对位置挂贴(外部定位)等办法。


楼主人间惆怅客SD 时间:2012-09-11 00:07:53
作者 :枫叶Fs 时间:2012-09-11 12:54:56
  好喜欢这个编辑,谢谢惆怅啦!辛苦了。。。
作者 :星连193 时间:2012-09-11 13:42:42
  现在才知道为什么老师有工资拿,而学生没有。
作者 :2012雨中的邂逅 时间:2012-10-02 17:09:21
  好学习
作者 :偷笑的兔子 时间:2012-10-10 15:54:39
  老师您辛苦了!学习,问好!
作者 :孤客在路上 时间:2012-12-12 20:05:18
  学习了。
作者 :不与莉花同梦 时间:2013-05-24 10:23:09
  我这脑子,只能一步步来了。
作者 :花若怜_泪涧成线 时间:2013-07-12 16:57:46
  O(∩_∩)O谢谢楼主!!!

相关推荐

    发表回复

    请遵守天涯社区公约言论规则,不得违反国家法律法规