以文本方式查看主题

-  堕落街论坛  (http://duoluojie.1314179.com.cn:443/index.asp)
--  天下美图  (http://duoluojie.1314179.com.cn:443/list.asp?boardid=55)
----  教大家用HTML标签做帖  (http://duoluojie.1314179.com.cn:443/dispbbs.asp?boardid=55&id=31187)
--  作者：数到三就不哭
--  发布时间：2004/6/7 23:39:00
--  教大家用HTML标签做帖

一：背景

效果如：

原代码如下：

<TABLE align=center background="帖子背景图" border=0 cellPadding=0 cellSpacing=0 borderColor=#ffff00 width="100%"><TBODY><TR><TD>

帖子内容，文字或图片..... </TD></TR></TBODY></TABLE> <TABLE> 的参数设定（常用）：

<table width="400" border="1" cellspacing="2" cellpadding="2" align="CENTER" valign="TOP" background="myweb.gif" bgcolor="#0000FF" bordercolor="#CF0000" bordercolorlight="#00FF00" bordercolordark="#00FFFF" cols="2">

注解：

width="400" 表格宽度，接受绝对值（如 80）及相对值（如 80%）。

border="1" 表格边框的厚度，不同浏览器有不同的内定值，故请指明。

cellspacing="2" 表格格线的厚度

align="CENTER" 表格的摆放位置（水平），可选值为： left, right, center

valign="TOP". 表格内内容的对齐方式（垂直），可选值为： top, middle, bottom。 　　

background="myweb.gif" 表格的背景图片，与 bgcolor 不要同用。

bgcolor="#0000FF" 表格的底色，与 background 不要同用

bordercolor="#CF0000" 表格边框颜色

bordercolorlight="#00FF00" 表格边框向光部分的颜色

bordercolordark="#00FFFF" 表格边框背光部分的颜色，使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。

cols="2" 表格栏位数目，只是让浏览器在下载表格时先画出整个表格而已。
--  作者：数到三就不哭
--  发布时间：2004/6/7 23:42:00
--  二，图形标记：

帖图格式：

<IMG src="图片连接URL地址">

<IMG> 称图形标记，主要用来插入图形标记。

<IMG> 的一般参数设定：

　　例如 <img src="logo.gif" width=100 height=100 hspace=5 vspace=5 border=2 align="top" alt="Logo of PenPals Garden" lowsrc="pre_logo.gif">

src="logo.gif" 图片来源，接受 .gif, .jpg 及 .png 格式，前两者通行已久，后者则由 96 年开始发展， 于未来取代前两者。若图片档与该 html 档同处一目录则只需写上档案名称，否则 必须加上正确的路径，相对或绝对均可。

width=100 height=100 设定图片大小，此宽度及高度一般采用 pixels 作单位。通常只设为图片的真实 大小，以免失真，若需要改图片大小最好使用图像编辑工具。（改变大小的宽和高与原图的宽和高要成正比例，图片最好是改小不改大，以免失真。）

hspace=5 vspace=5 设定图片边沿空白，以免文字或其它图片贴近。hspace 是设定图片左右的空间， 是设定图片上下的空间，高度采用 pixels 作单位。

border=2 图片边框厚度

align="top" 调整图片旁边文字的位置，你可以控制文字出现在图片的偏上方、中间、底部、 左右等，可选值：top, middle, bottom, left, right，内定为 botom。Netscape 还支持 texttop, baseline, absmiddle, absbottom， texttop 表示图片和文字依顶线对齐， baseline 表示图片对齐到目前文字行底线值， absmiddle 表示图片对齐到目前文字行绝对中央， absbottom 表示图片对齐到目前文字行绝对底部，（绝对底部是指它考虑到比如 y 、g、q 等字的下边）。

alt="Logo of PenPal Garden" 这是用以描述该图形的文字，若使用文字浏览器，由于不支持图片，这些文字 将会代替图片被显示。若支持图片的浏览器，当鼠标移至图片上该文字也会显示。

lowsrc="pre_logo.gif" 设定先显示低解析度的图片，若加入的是一张很大的图片，下载要很长的时间，这张低 解析度的图片会先被显示以免浏览者失去兴趣，通常是原图的黑白版本。

例：普通插入

原代码：

<IMG border=0 height=92 src="http://www.cn898.net/bbs/UploadFile/20045243172762519.gif" width=130>　

　

调整图片位置：（居中）

原代码：<P align=center><IMG border=0 height=92 src="http://www.cn898.net/bbs/UploadFile/20045243172762519.gif" width=130></P>

align=位置参数　可先值为：center（居中）　left （居左）　right （居右）
--  作者：数到三就不哭
--  发布时间：2004/6/7 23:43:00
--  三，文字设制

文字设制

一，文字基本设制

基本代码如下：

<P align=center><FONT color=#0066ff face=隶书 size=5>插入文字</FONT></P>

align=center　表示字体居中，可选值为居右（right）居左（left）

color=颜色代码　具体颜色代码可参照：颜色选取＜＜点击查看

face=字体　常用字体为：宋体.黑体.楷体.仿宋.幻缘.新宋体.细明体等

size=字体大小，这里的最大值为7　取值越大文字就越大

二，大字体文字

效果：

数到三就不哭

代码：

<font style=font:40pt face=新宋体 color=#ff0000>插入文字</font>

font:40pt　数值越大文字就越大。

三，移动文字设置：

基本代码1：

<marquee direction=移动方向 scrollamount=移动速度数值>插入文字</marquee>

说明：direction=移动方向　可选值为向上(up)　向下(down)　向左(left)　向右(right)

基本代码2：

<marquee behavior=移动效果>插入文字</marquee>

说明：

behavior=scroll 一圈一圈绕着走　

behavior=slide

只走一次　behavior=alternate 来回走

停停走走：

效果如：

数到三就不哭

代码如下：

<marquee scrolldelay=500 scrollamount=100>插入文字</marquee>

四，文字特效显示：

效果一：

数到三就不哭

原代码：

<CENTER><FONT style="COLOR: #e4dc9b; FILTER: shadow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 30pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>数到三就不哭</B></FONT></CENTER>

效果二：

数到三就不哭

原代码：

<CENTER><FONT style="COLOR: #e4dc9b; FILTER: glow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 30pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>数到三就不哭</B></FONT></CENTER>

效果三：

数到三就不哭

原代码：

<CENTER><FONT color=#0099ff style="FILTER: blur(add=1, direction=40,strength=10); FONT-SIZE: 30px; FONT-WEIGHT: bolder; POSITION: relative; WIDTH: 450px">数到三就不哭</FONT></CENTER>

效果四：

数到三就不哭

原代码：

<MARQUEE behavior=alternate direction=up height=150 scrollAmount=5><MARQUEE behavior=altrnate scrollAmount=2 width=460 <IMG src="http://www.east128.com/bbs/UploadFile/2003-9/20039251018214901.gif"><FONT color=red face=楷体_gb2312 size=7>数到三就不哭</FONT></MARQUEE></MARQUE></MARQUEE>

效果五：

欢迎你朋友 友朋你迎欢

原代码：

<FONT color=#0096ff face=隶书 size=7><MARQUEE height=50 width=240>欢迎你朋友</FONT></MARQUEE><FONT color=#0000ff face=隶书 size=7><MARQUEE direction=right height=50 width=240>友朋你迎欢</MARQUEE></FONT></FONT>

注明：在用这种效果时，文字移动范围的宽width的取值很重要，两段文字移动范转的width取值和一定要小于背景层width的取值。
--  作者：数到三就不哭
--  发布时间：2004/6/7 23:44:00
--  四，载入音乐

基本语法：

<EMBED SRC="音乐文件地址">

常用属性如下：

SRC="FILENAME" 设定音乐文件的路径
AUTOSTART=TRUE/FALSE 是否要音乐文件传送完就自动播放，TRUE是要，FALSE是不要，默认为FALSE
LOOP=TRUE/FALSE 设定播放重复次数，LOOP=6表示重复6次，TRUE表示无限次播放，FALSE播放一次即停止。
STARTIME="分:秒" 设定乐曲的开始播放时间，如20秒后播放写为STARTIME=00:20
VOLUME=0-100 设定音量的大小。如果没设定的话，就用系统的音量。
WIDTH HEIGHT 设定控制面板的大小
HIDDEN=TRUE 隐藏控制面板
CONTROLS=CONSOLE/SMALLCONSOLE 设定控制面板的样子

例一：

<EMBED SRC="midi.mid" autostart=true hidden=true loop=true>

作为背景音乐来播放，隐藏了播放器。

例二：

<EMBED SRC="midi.mid" loop=true width=145 height=60>

出现控制面板了，你可以控制它的开与关，还可以调节音量的大小。

注明：mp3 rm ra ram asf mid等音乐都用这个播放器

IE中的的背景音乐

代码如下：

<bgsound src="音乐文件地址" loop=#>

#=循环数

注明：这种背景音乐格式，只有在IE浏览器中才可以听到。一般用来插入wav wma mid等格试的音乐。

在论坛做帖常用格试如下：

一：

<EMBED height=200 src=音乐文件地址 type=audio/x-pn-realaudio-plugin width=200 autostart="true" controls="IMAGEWINDOW,ControlPanel,StatusBar" console="Clip1"></EMBED>

说明：一般用来插入mp3 rm ra ram asf mid等音乐文件，如果要隐藏播放器，把width和height的数值改成0或者1就可以了。

二：

<bgsound src="音乐文件地址" loop=3>
说明：一般用来插入wav wma mid等格试的音乐文件。
--  作者：数到三就不哭
--  发布时间：2004/6/7 23:48:00
--  五，一些常用的特效

由与7.0的论坛屏蔽掉了很多特效，在这里能用的很少。

例1：

原代码如下：

<MARQUEE behavior=alternate direction=up height=300 width=110><img src=http://bbs.mz99.com/UploadFile/2004-6/20046733350553.gif></MARQUEE><FONT color=orange><MARQUEE behavior=alternate direction=up height=250 width=110><img src=http://bbs.mz99.com/UploadFile/2004-6/20046733350553.gif></MARQUEE><FONT color=Fuchsia><MARQUEE behavior=alternate direction=up height=300 width=110><img src=http://bbs.mz99.com/UploadFile/2004-6/20046733350553.gif></MARQUEE><FONT color=olive><MARQUEE behavior=alternate direction=up height=250 width=110><img src=http://bbs.mz99.com/UploadFile/2004-6/20046733350553.gif></MARQUEE>

例二：

数 到 三 就 不 哭

原代码如下：

<CENTER><MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><B><FONT color=#6495ed face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">数 <IMG src="http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif" ;></FONT></B></MARQUEE><MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><B><FONT color=#6495ed face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">到 <IMG src="http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif" ;></FONT></B></MARQUEE><MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><B><FONT color=#6495ed face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">三 <IMG src="http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif" ;></FONT></B></MARQUEE><MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><B><FONT color=#6495ed face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">就 <IMG src="http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif" ;></FONT></B></MARQUEE><MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><B><FONT color=#6495ed face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">不 <IMG src="http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif" ;></FONT></B></MARQUEE><MARQUEE height=87 scrollAmount=2 width=80 scrolldely="10" align="center"><B><FONT color=#6495ed face=汉鼎繁中变 style="FONT-SIZE: 30pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; LINE-HEIGHT: normal">哭 <IMG src="http://bbs.mz99.com/UploadFile/2004-6/20046734212802.gif" ;></FONT></B></MARQUEE></CENTER>

例三：

原代码如下：

<P align=center><FONT style="FONT-SIZE: 27pt; WIDTH: 220px; COLOR: #00ff00; HEIGHT: 10px"><IMG src="http://www.smba-china.com/upload/upfile/2004430154320.gif"><FONT id=ew style="FONT-SIZE: 27pt; FILTER: wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv(); WIDTH: 220px; COLOR: #3333ff; HEIGHT: 10px"><IMG src="http://www.smba-china.com/upload/upfile/2004430154320.gif"></P></FONT></FONT>

注明* 在HTML模式下插处代码，在把自动修正取消之后再发表才能正常显示。

例四：

原代码如下：

<TABLE border=0><TBODY><TR><TD background=http://bbs.mz99.com/UploadFile/2004-5/200452611713336.gif height=180 style="FILTER: Alpha(opacity=100,style=2)" width=300></TD></TR></TBODY></TABLE>

注明* 在HTML模式下插处代码，在把自动修正取消之后再发表才能正常显示。

[此贴子已经被作者于2004-6-15 3:25:23编辑过]
--  作者：数到三就不哭
--  发布时间：2004/6/7 23:53:00
--  

符：HTML基本语法教程 1，http://www.gzsums.edu.cn/webclass/html/html_design.html 2，http://www.shanxiwindow.net/teaching/htmlbook/ 在线编辑器： http://www.cn898.net/bg/mx/

--  作者：灿宇
--  发布时间：2004/6/8 0:09:00
--  
好东西哈！！！！！！！！！
--  作者：数到三就不哭
--  发布时间：2004/6/8 0:43:00
--  透明FLASH的应用
以下内容含脚本,或可能导致页面不正常的代码
说明：上面显示的是代码内容。您可以先检查过代码没问题，或修改之后再运行.
--  作者：行走的鱼
--  发布时间：2004/6/9 13:38:00
--  

图片点击可在新窗口打开查看

让它沉掉太可惜了，为什么不固定？
--  作者：juncky
--  发布时间：2004/6/9 13:44:00
--  
原本以为不哭早已绝迹人间，却不想不哭依然还食人间烟火。。。