发新话题
打印

欢迎您!启步学代码

本主题由 stone 于 2007-12-6 04:44 置顶


 

 

 

爱虎BT论坛

欢迎您!启步学代码。
(8)

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

文字设置学习的几点体会。

  (一)文字设置标签属性三个主要内容的使用。

(1)字号大小

  字号大小语句通常是<FONT size=1-7>字号</FONT>其大小是由参数所定,最小是1,最大是7。为了方便使用更大的字体,字号大小可用以下的语句:
<FONT style=font:40pt>字号</FONT>字号隋数值增大,不受限制。


    文字设置用普通字号的代码:

<CENTER><font size=5 face=隶书 color=00FF00>
学习代码贴图</font>

</CENTER>

(关键语句:size=5)

学习代码贴图




    文字设置用大字号的代码:

<CENTER><font style=font:50pt face=隶书 color=00ff00>
学习代码贴图</font>
</CENTER>

(关键语句:style=font:50pt)


     显示:
学习代码贴图


(2)使用什么样字体

  用代码贴字,字体一定要用网络上经常能显示的十余种。如:
宋体 黑体 楷体_GB2312  仿宋_GB2312 新宋体  幼圆 隶书
方正舒体 华文新魏 华文行楷 华文细黑 华文彩云 方正姚体

  如果采用文鼎花瓣体等其他字体,会显示为宋体。


(3)文字颜色的代码

 文字的颜色可用0和F 6个字符组成易记住的颜色代码,例如:

黑色=000000 白色=ffffff 红色=ff0000 绿色=00ff00 
蓝色=0000ff 黄色=fff000 青色=00ffff 紫色=ff00ff


  (二)特效文字代码可以做出很多漂亮的字体,灵活的运用文字设置标签属性的三个主要内容,即字号,字体和颜色,也可编辑出精彩的字体。

七色彩字体的代码:


<CENTER>
<FONT face=隶书 color=ff0000 style=font:40pt>网
<FONT color=fff000>络</FONT>
<FONT color=0000ff>世</FONT>
<FONT color=green>界</FONT>
<FONT color=fffff0>欢</FONT>
<FONT color=ff00ff>迎</FONT>
<FONT color=00ffff>您</FONT>
</FONT></CENTER>
 

显示结果:


多种字号和字体的代码:

<CENTER><FONT face=新宋体 color=00ff00 style=font:15pt>
<FONT face=隶书 ><h1>《闺 怨》</h1></FONT>
<h3>王昌龄</h3>
闺中少妇不知愁,春日凝妆上翠楼。<BR>
忽见陌头杨柳色,悔教夫婿觅封侯。<BR>
</FONT>
 


《闺 怨》

王昌龄

闺中少妇不知愁,春日凝妆上翠楼。
忽见陌头杨柳色,悔教夫婿觅封侯。


爱虎BT论坛

(待续)

 

爱虎BT论坛
编辑:游子

TOP



HTML代码编辑资料小平台


常用字体代码

宋体 黑体 楷体_GB2312 仿宋_GB2312 华文行楷
隶书 方正舒体 华文新魏 幼圆 新宋体 华文细黑
华文彩云 方正姚体



常用HTML代码语句:


<CENTER>内容</CENTER>   内容居中
<<img src="http://bbs.ioohoo.com/images/smilies/default/titter.gif" border=0 smilieid="9"> align=LEFT>左对齐 </P>  内容左对齐和过一段
<<img src="http://bbs.ioohoo.com/images/smilies/default/titter.gif" border=0 smilieid="9"> align=center>居中 </P>  内容居中和过一段
<<img src="http://bbs.ioohoo.com/images/smilies/default/titter.gif" border=0 smilieid="9"> align=RIGHT>右对齐 </P>  内容右对齐和过一段

文字设置代码:

<font style=font:20pt face=隶书 color=fff000>内容</font>


编辑:游子




TOP

 

 

 

爱虎BT论坛

欢迎您!启步学代码。
(9)

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




    表格设置是代码贴图和制作个人主页的主要基础,表格设置标签属性内容有十多个,可以先从7个常用的学起,逐步提高。先看用表格做成的 一张图片,这张图片宽300,高200,蓝色边框,黄色背景,插入一段文字,内容与边框有一定的距离。




表格设置是代码贴图和制作个人主页的主要基础,表格设置标签属性内容有十多个,可以先从7个常用的学起,逐步提高。

代码:

<CENTER><BR>
<TABLE border=10 borderColor=#0000ff cellSpacing=10 cellpadding=20 bgcolor=fff000 width=400 height=300>
<TBODY><TR><TD>
<font style=font:15pt face=黑体 color=0000ff>
表格设置是代码贴图和制作个人主页的主要基础,
表格设置标签属性内容有十多个,可以先从7个常用的学起,逐步提高。
</CENTER></font></TD></TR></TBODY></TABLE>  

注解:

第一行是居中代码。
第二和第三行是表格的始标签,包括表格标签名和7个属性内容。
第四行是表格输入内容的行和列的始标签。(行和列构成一个单元格)
第五行是文字设直标签。
第六和第七行输入文字内容。
第八行是以上各个始标签的对应尾标签 。

表格设置标签属性内容说明:
TABLE=标签名。 
border=10 表格边框的厚度及参数。
borderColor=#0000ff 边框颜色及颜色码。
cellSpacing=10 单元格间距及参数。
cellpadding=20 内容与格线的距离及参数。
bgcolor=fff000 表格的背景颜色及及颜色码。
width=400 表格宽度及参数。
height=300 表格高度及参数。

    表格宽度及表格高度的参数,可用绝对值,如300:也可用相对值,如“100%”。高度如果不是特殊需要时, 也可以不加入参数,系统会根据输入的内容自动延伸。

爱虎BT论坛


一张用颜色作背景的空白图框代码:

<CENTER>
<TABLE border=10 borderColor=#0000ff cellSpacing=10 cellpadding=20 bgcolor=fff000 width=400 height=300>
<TBODY>
<TR>
<TD>
<br>
<br>
</CENTER></TD></TR></TBODY></TABLE>
 


显示结果:




一张用图片作背景的空白图框代码:

<CENTER>
<TABLE border=10 borderColor=#0000ff cellSpacing=10 cellpadding=20 cellpadding=20 background=http://www.s1.inets.jp/~rouge/free/005h.jpg width=400 height=300>
<TBODY>
<TR>
<TD>
<br>
<br>
</CENTER></TD></TR></TBODY></TABLE>
 


显示结果:




用颜色作背景和用图片作背景不同之处,只改变一个属性内容,即:
表格的背景颜色及颜色码。bgcolor=fff000
改为用图片作背景即:


background=http://www.s1.inets.jp/~rouge/free/005h.jpg

(待续)

爱虎BT论坛


编辑:游子

TOP

如何发HTML代码贴?

如何发HTML代码贴?

有一些新学习代码的网友不知要如何发HTML代码贴?首先准备一个空白记事本最大化打开。

下面是一张图框的图片代码。

<TABLE borderColor=#fff000 cellpadding=30 cellpadding= 15 cellSpacing=15 cellPadding=15 width="500" bgcolor="#0000FF" border=12> <TBODY>
<TR>
<TD>
<CENTER><font style=font:20pt face=幼圆 color=fff000>插入内容</font>
</CENTER>
<BR><BR><BR><BR>
</TD></TR></TBODY></TABLE>

第二,击点这个回复标签进到发贴区。
第三,在标签栏选第四个标签(即HTML标签)
第四,把刚才复制的代码粘贴在编辑栏内。
第五,击点标签栏的第一个标签可看见效果。
第六,若成功即可发表了。

编辑:游子



TOP

爱虎BT论坛

启步学HTML代码小知识。
(二)

(学习心得 供初学HTML代码的朋友参考)



正确便用代码的功能

    编辑HTML代码要允份利用HTML代码的“始标签”和“尾标签”。在查看一些网友贴子的源代码时,经常会看见类似如下的情况:


<<img src="http://bbs.ioohoo.com/images/smilies/default/titter.gif" border=0 smilieid="9"> align=center><font style=font:16pt face=隶书 color=fff000>《 离 骚》 屈 原</font></P>

<<img src="http://bbs.ioohoo.com/images/smilies/default/titter.gif" border=0 smilieid="9"> align=center><font style=font:16pt face=隶书 color=fff000>悔相道之不察兮,延伫乎吾将返。</font></P>

<<img src="http://bbs.ioohoo.com/images/smilies/default/titter.gif" border=0 smilieid="9"> align=center><font style=font:16pt face=隶书 color=fff000>回朕车以复路兮,及行迷之未远。</font></P>

<;P align=center><font style=font:16pt face=隶书 color=fff000>步余马于兰皋兮,驰椒丘且焉止息。</font></P>

<;P align=center><font style=font:16pt face=隶书 color=fff000>进不入以离尤兮,退将复修吾初服。</font></P>

<;P align=center><font style=font:16pt face=隶书 color=fff000>制芰荷以为衣兮,集芙蓉以为裳。</font></P>

<;P align=center><font style=font:16pt face=隶书 color=fff000>不吾知其亦已兮,苟余情其信芳。</font></P>

<;P align=center><font style=font:16pt face=隶书 color=fff000>高余冠之岌岌兮,长余佩之陆离。</font></P>

<;P align=center><font style=font:16pt face=隶书 color=fff000>芳与泽其杂糅兮,惟昭质其犹未亏。</font></P>

代码显示结果:

《 离 骚》 屈 原

悔相道之不察兮,延伫乎吾将返。

回朕车以复路兮,及行迷之未远。

步余马于兰皋兮,驰椒丘且焉止息。

进不入以离尤兮,退将复修吾初服。

制芰荷以为衣兮,集芙蓉以为裳。

不吾知其亦已兮,苟余情其信芳。

高余冠之岌岌兮,长余佩之陆离。

芳与泽其杂糅兮,惟昭质其犹未亏。




    这九组文字设置可以只设一组,用HTML代码的“始标签”和“尾标签”代替。


<center><font style=font:16pt face=隶书 color=fff000>
《 离 骚》 屈 原<BR><BR>
悔相道之不察兮,延伫乎吾将返。<BR><BR>
回朕车以复路兮,及行迷之未远。<BR><BR>
步余马于兰皋兮,驰椒丘且焉止息。<BR><BR>
进不入以离尤兮,退将复修吾初服。<BR><BR>
制芰荷以为衣兮,集芙蓉以为裳。<BR><BR>
不吾知其亦已兮,苟余情其信芳。<BR><BR>
高余冠之岌岌兮,长余佩之陆离。<BR><BR>
芳与泽其杂糅兮,惟昭质其犹未亏。<BR>
</font></center>


代码显示结果:

《 离 骚》 屈 原

悔相道之不察兮,延伫乎吾将返。

回朕车以复路兮,及行迷之未远。

步余马于兰皋兮,驰椒丘且焉止息。

进不入以离尤兮,退将复修吾初服。

制芰荷以为衣兮,集芙蓉以为裳。

不吾知其亦已兮,苟余情其信芳。

高余冠之岌岌兮,长余佩之陆离。

芳与泽其杂糅兮,惟昭质其犹未亏。


爱虎BT论坛
编辑:游子



[ 本帖最后由 stone 于 2007-12-5 22:49 编辑 ]

TOP

爱虎BT论坛

启步学HTML代码小知识。
(三)

(学习心得 供初学HTML代码的朋友参考)





绝对位置挂贴代码

    用绝对位置挂贴代码可以在图片,贴子或网页上,再挂贴图文。下面是一个有背景图片,标题文字,有一张加插Flash 图片的贴子。这张图片准备:左上角贴一个大号的“顶”字,右上角加贴一张小图片,中央位置加贴一张Flash 图片。




未加挂贴前的贴子



绝对位置挂贴代码练习







加挂贴后的贴子



绝对位置挂贴代码练习





顶!
爱虎BT论坛


加挂贴后贴子的代码:


<TABLE cellSpacing=0 borderColorDark=#000000 cellPadding=0 width=500 borderColorLight=#000000 background=http://www.s1.inets.jp/~rouge/free/5.jpg border=5>
<TBODY>
<TR>
<TD>
<CENTER>
<BR><BR>
<<img src="http://bbs.ioohoo.com/images/smilies/default/titter.gif" border=0 smilieid="9"> align=center><FONT style="FONT-SIZE:26; FILTER: shadow color=apar); WIDTH: 100%; COLOR: #00ff00; LINE-HEIGHT: 150%" face=隶书>绝对位置挂贴代码练习
<BR><BR><BR><BR>
<TABLE cellSpacing=0 borderColorDark=#000000 cellPadding=0 width=460 borderColorLight=#000000 background=http://www1.yunbbs.com/yaoyao/7/000.01.jpg border=3>
<TBODY>
<TR>
<TD><EMBED align=right src=http://imgfree.21cn.com/free/flash/59.swf width=460 height=390 type=application/octet-stream wmode="transparent" quality="high" ;;>
</TD></TR></TBODY></TABLE><BR><BR>
<DIV id=Layer2 2; LEFT: 200px; WIDTH: 100px; POSITION: absolute; TOP: 1900px; HEIGHT: 100px"><FONT style="FONT-SIZE: 50pt; FILTER: shadow(color=fff000); WIDTH: 100%; COLOR: ff0000; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>顶! </B></FONT></DIV>
<DIV id=Layer2 2; LEFT: 500px; WIDTH: 120px; POSITION: absolute; TOP: 1900px; HEIGHT: 150px"><IMG src="http://bbs.680.cn/uploadfile/2005-4/20054922234985879.gif"WIDTH:100px HEIGHT:100px></DIV>
<EMBED style="LEFT: 50; WIDTH: 400px; POSITION: absolute; TOP: 2000; HEIGHT: 300px" align=center src=http://616bbs.vicp.net/picture/xx9/flash/9.swf type=application/octet-stream wmode="transparent" quality="high" ;;>
<BR>
</CENTER></FONT></TD></TR></TBODY></TABLE>
 


编辑:游子






[ 本帖最后由 stone 于 2007-12-5 22:51 编辑 ]

TOP

多行文字移动如何设置

启步学HTML
代码小知识。
  --多行文字移动如何设置



多行文字从下向上移动代码:
<marquee direction=up scrollamount=2> <br><CENTER>
《登金陵凤凰台》 李 白<br><font size=4>
凤凰台上凤凰游,凤去台空江自流.<br>
吴宫花草埋幽径,晋代衣冠成古丘.<br>
三山半落青天外,二水中分白鹭洲.<br>
纵为浮云能蔽日,长安不见使人愁.<br>
</font><br> </marquee></CENTER>

  显示结果:

 

《登金陵凤凰台》 李 白
凤凰台上凤凰游,凤去台空江自流.
吴宫花草埋幽径,晋代衣冠成古丘.
三山半落青天外,二水中分白鹭洲.
纵为浮云能蔽日,长安不见使人愁.


 



多行文字从上向下移动代码:
把上面代码中移动方向(direction=up)改为(direction=down),即可。
  <marquee direction=down scrollamount=2> <br><CENTER>
《登金陵凤凰台》 李 白<br><font size=4>
凤凰台上凤凰游,凤去台空江自流.<br>
吴宫花草埋幽径,晋代衣冠成古丘.<br>
三山半落青天外,二水中分白鹭洲.<br>
纵为浮云能蔽日,长安不见使人愁.<br>
</font><br> </marquee></CENTER>

  显示结果:

 

《登金陵凤凰台》 李 白
凤凰台上凤凰游,凤去台空江自流.
吴宫花草埋幽径,晋代衣冠成古丘.
三山半落青天外,二水中分白鹭洲.
纵为浮云能蔽日,长安不见使人愁.


编辑:游子
 


[ 本帖最后由 stone 于 2007-12-5 22:52 编辑 ]

TOP



如何编辑全屏代码

    用代码贴图的页面,一般是比较宽,如果没有设置全屏层,往往只能看到一部份页面。如何编辑全屏?常用的代码有:

全屏代码(1)
id=table1 style="LEFT: -220px; WIDTH: 800px; POSITION: relative; TOP: 40px"



这里有一张图框:




插入内容






图框的代码:

<TABLE borderColor=#fff000 cellSpacing=15 cellPadding=30 width=500 bgColor=#0000ff border=12>
<TBODY>
<TR>
<TD><br>
<CENTER><font style=font:20pt face=隶书 color=fff000>插入内容
<br><br><br><br> </FONT></CENTER></TD></TR></TBODY></TABLE>


    复制全屏代码粘贴到上面图框代码的第一行的 TABLE 和borde之间即可。注意:全屏代码是加在图框最外一层,图框原设定宽500,现在也加大到760。在头行前和尾行后各设几个过行BR代码,才不会把一些标签功能复盖掉。 图框加全屏代码:

<TABLE id=table1 style="LEFT: -220px; WIDTH: 800px; POSITION: relative; TOP: 40px" borderColor=#fff000 cellSpacing=15 cellPadding=30 width=500 bgColor=#0000ff border=12>
<TBODY>
<TR>
<TD><br>
<CENTER><font style=font:20pt face=隶书 color=fff000>插入内容
<br><br><br><br> </FONT></CENTER></TD></TR></TBODY></TABLE>

显示结果:






插入内容








全屏代码(2)


<DIV style="LEFT: -10px; WIDTH: 760px; POSITION: relative; TOP: 0px">


    这种代码单独加在图框代码的最前面,全屏层宽度虽是760,但图框的宽仍是保持600。图框代码加全屏代码(2)的示例:


<DIV style="LEFT: -40px; WIDTH: 760px; POSITION: relative; TOP: 0px">
<TABLE borderColor=#fff000 cellSpacing=15 cellPadding=30 width=600 bgColor=#0000ff border=12>
<TBODY>
<TR>
<TD><br>
<CENTER><font style=font:20pt face=隶书 color=fff000>插入内容
<br><br><br><br> </FONT></CENTER></TD></TR></TBODY></TABLE>

显示结果:







插入内容








[ 本帖最后由 stone 于 2007-12-5 22:54 编辑 ]

TOP

如何发HTML代码贴?

如何发HTML代码贴?

有一些新学习代码的网友不知要如何发HTML代码贴?首先准备一个空白记事本最大化打开。

下面是一张图框的图片代码。

<TABLE borderColor=#0000ff cellpadding=30 cellpadding= 15 cellSpacing=15 cellPadding=15 width="500" bgcolor="#0000FF" border=12> <TBODY>
<TR>
<TD>
<CENTER><font style=font:20pt face=幼圆 color=0000ff>插入内容</font>
</CENTER>
<BR><BR><BR><BR>
</TD></TR></TBODY></TABLE>

第二,击点这个回复标签进到发贴区。
第三,在标签栏选第四个标签(即HTML标签)
第四,把刚才复制的代码粘贴在编辑栏内。
第五,击点标签栏的第一个标签可看见效果。
第六,若成功即可发表了。

编辑:游子


爱虎BT论坛



[ 本帖最后由 stone 于 2007-12-5 22:55 编辑 ]

TOP

启步学HTML代码小知识。

(学习心得 供初学HTML代码的朋友参考)

播放器和背景音乐设置代码

银色播放器:


银色播放器代码:

<embed src="http://.......mp3" type="audio/x-pn-realaudio-plugin" controls="controlpanel,statusbar" height=50 width=400 autostart="true" loop="true">

黑色播放器:


黑色播放器代码:

<EMBED style="FILTER: xray()" src=http://..........mp3 width=460 height=45 type=audio/mpeg loop="-1" autostart="true" volume="0">


设置背景音乐时,如果要隐藏播放器,把播放器的宽度和高度都设为0 (width=0 height=0),就看不到播放器了。


显示播放器:



显示播放器代码:

<TABLE cellSpacing=3 borderColorDark=#fff000 cellPadding=0 width=375 borderColorLight=#fff000 background=http://blog.lanyue.com/upload/user/58/386410_22232240.jpg border=1>
<TBODY>
<TR>
<TD width="100%">
<TABLE cellPadding=0 width="100%" background=http://blog.lanyue.com/upload/user/58/386410_22232320.jpg border=0>
<TBODY>
<TR>
<TD width="100%">
<TABLE cellSpacing=3 borderColorDark=#000000 cellPadding=0 width="100%" borderColorLight=#294913 background=http://blog.lanyue.com/upload/user/58/386410_22232240.jpg border=1>
<TBODY>
<TR>
<TD width="100%">
<CENTER><EMBED style="FILTER: xray()" src=http://bbs.jmrb.com/bbs/upfile/music/601.mp3 width=375 height=50 type=audio/mpeg Kern - The Winding Path 32-01.wma loop="-1" autostart="true" volume="0" ShowStatusBar="1" louie.mp3 Louie.mp3 Amo.WMA Ti Che Dirti Pausini--Volevo>
</CENTER></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P></DIV>


编辑:游子






[ 本帖最后由 stone 于 2007-12-5 22:56 编辑 ]

TOP

‹‹ 上一主题 | 下一主题 ››
 37 1234
发新话题