博客制作技巧与代码解释  

2008-07-29 10:59:12|  分类： 制作入门 |字号 订阅

文章背景图片代码 <TABLE cellSpacing=8 borderColorDark=#374d37 cellPadding=2 width=642 borderColorLight=#86ae86 background=http://abc/abc/abcabcabcabc000000000000000.jpg border=0> <TBODY> <TR> <TD width="90%"></TD></TR></TBODY></TABLE> [插入一个flash动画的代码] <embed width=200 height=200 src="//www.pw178.com/net/flashes/clock/clock30.swf";>    多图片左右滚动代码 <MARQUEE   scrollAmount=2 scrollDelay=0  behavior=alternate    width=180 height=240> <IMG height=240 src=" 图片网址1 " width=180 border=0>   <IMG height=240 src=" 图片网址 " width=180 border=0>   <IMG height=240 src=" 图片网址9 " width=180 border=0> </MARQUEE>    操作步骤与注意事项 宽[width]为180  高[height]为240  可根据实际需要更改 增减图片，增减代码中的 <IMG height=240 src="图片网址1" width=180 border=0> 增加的部分要放在代码最后的 </MARQUEE> 前面。    透明falsh 代码 <EMBED style="LEFT: 10px; POSITION: absolute; TOP: -70px" align=right src=透明flash地址 width=700 height=400 type=application/x-shockwave-flash wmode="transparent" quality="high" ;></EMBED>   音乐单播放器代码：  <EMBED src=歌曲地址 width=188 height=45 type=audio/x-ms-wma autostart="true" loop="true"></EMBED>   其中autostart="true"表示自动播放， 把"true"改为"false"则不自动播放    图片上飘动文字的代码 <TABLE borderColor=#cd5c5c height=350 width=450 align=center border=3> <TBODY>  <TR>  <TD  background=图片地址> <MARQUEE scrollAmount=3 direction=down behavior=alternate height=350> <MARQUEE scrollAmount=3 behavior=alternate width=500> <P align=center><FONT color=red size=6><B> 输入你想要的文字 </B></FONT></P></MARQUEE></MARQUEE></TD></TR> </TBODY></TABLE>   代码说明  width为浮动文字框架的宽度；height为浮动文字框 架的高度；color=red表示文字颜色为红色   图片水中倒影效果代码 <P><IMG src="//t3.baidu.com/it/u=1565282019,3757634880&gp=3.jpg" width="200" height="150"><BR> <IMG id="reflection" src="//t3.baidu.com/it/u=1565282019,3757634880&gp=3.jpg" style="filter:wave (strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()" width="200" height="150"> </P>   金铜空心文字代码 <CENTER><FONT style="COLOR: #e4dc9b; FILTER: shadow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 30pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>文字粘贴处</B></FONT></CENTER>   竖排显示文字代码 <DIV style="FONT-SIZE: 9pt; WRITING-MODE: tb-rl; TEXT-ALIGN: left"><p>博客文章文字</P></DIV>    和讯博客侧边栏滚动字幕代码设置  上下滚动字幕 <DIV align=center> <DIV style="OVERFLOW: auto; WIDTH: 159px; HEIGHT: 145px"> <MARQUEE class=p131 scrollAmount=1 scrollDelay=60 direction=up height=145 onmouseover="this.stop()" onmouseout="this.start ()" align="left" WIDTH: 200px;> <P align=left><FONT size=3> 粘贴文字</FONT></P></MARQUEE>   把上面代码中的有关数据做如下的改动， 就变成左右滚动字幕 <marquee direction="left" scrollamount="1"         scrolldelay="10" border="0" width=500 >    背景音乐代码 (写在日记标题里) 代码中的音乐地址就是网上以.  mp3/.  midi/  .wma/ . wmv  结尾的网址   显示播放器 </textarea><EMBED SRC=http://你的音乐地址>   不显示播放器 </textarea><EMBED SRC=http://你的音乐地址 width="0" height="0" loop="999">    背景音乐随机播放代码设置 　<script> document.writeln("<script language=jscript.encode src=http:\/\/www1.k688.com\/midi\/midiok.js><\/script>") var i = Math.round(Math.random()*30); var browsername = navigator.appName; var gettype = browsername; if (gettype=="Netscape") { document.write('<embed src="//www.dabaoku.com/bjyinyue/mid/'+i+'.mid" autostart=true WIDTH=0 HEIGHT=0 REPEAT=TRUE>')} else {document.write('<bgsound src=http://www.dabaoku.com/bjyinyue/mid/'+i+'.mid loop=-1>') } </script>    如果要显示播放器，把代码中的 “WIDTH=0 HEIGHT=0” 更改为  “WIDTH=200 HEIGHT=60”   即可。   博客侧边栏放置FLASH动画代码设置 <DIV align=center><EMBED src=FLASH的网址 width=180 height=60 type=application/x-shockwave-flash></DIV>    FLASH的网址是以 http:// 开头、以 swf 结尾的。   文字代码说明： 1.align=center：表示字体居中，可选值为居右(right)、居左(left)。   2.color=颜色代码。字体属性是：face 颜色的属性是color。   3.face=字体。常用字体为：文鼎花瓣体、宋体、黑体、楷体、仿宋、幻缘、新宋体、细明体、隶书、幼圆、华文琥珀、华文行楷、华文彩云(用做题目)、华文细黑、华文新魏、华文中宋、方正舒体、方正姚体、仿宋_GB2312.楷体_GB2312、宋体-方正超大字符集、汉鼎繁中变、华文楷体。   4.size=字体大小，这里的最大值为7,取值越大文字就越大。   5.文字标记是“<*font>”可以用“<*font>”标记的不同属性来分别设置文本中文字的大小，字体，字型，字色等。<*Font>标记的格式是:<*font 属性＝属性值>被设置的字<*/font>。   6.<*BR>是文字换行   7.<*P>是段控制。标记是<*p>放在文字后，使得其后文字空一行后换行显示。<*p>的属性align用来设置文字的对齐方式。属性值是center(居中对齐)，left(向左对齐)，right(向右对齐)。   8.下划线：<*U><*/U>   移动文字代码说明：  left向右移动  right向左移动  alternate来回走  direction=up向上  direction=down向下 scrollamount移动速度  scrolldelay停停走走     让你的文字动起来——marquee用法详解： A.参数一：direction <*marquee direction=up>向上移动<*/marquee> direction的英文意思就是方向。这个参数的取值有四个：left(左)、right(右)、up(上)、down(下)。   B.参数二：behavior <*marquee direction=left behavior=alternate>哈哈，我来回走！<*/marquee> scroll(循环移动)、slide(只移动一个回合)、alternate(来回移动)。   C.参数三：loop 循环。若未指定则循环不止(infinite)，其值取数值。例： <*marquee loop=3>我只走三次哦<*/marquee>   D.参数四：scrollamount 移动速度。值取正整数。数值越大，速度越快。例： <*marquee scrollamount=25>看，我走多快！<*/marquee>   E.参数五：scrolldelay 延时。数值。 例：<*marquee scrolldelay=1000>我走一走，停一停<*/marquee>   代码的常用识别参数 <TABLE align=center background="帖子背景图" border=0 cellPadding=0 cellSpacing=0 borderColor=#ffff00 width="100%"><TBODY><TR><TD>   帖子内容，文字或图片..... </TD></TR></TBODY></TABLE>   <TABLE> 的参数设定（常用）：   <table width="100%" border="1" cellspacing="2" cellpadding="2" align="CENTER" valign="TOP" background="myweb.gif" bgcolor="#0000FF" bordercolor="#CF0000" bordercolorlight="#00FF00" bordercolordark="#00FFFF" cols="2">   注解：   width="100" 表格宽度，接受绝对值（如 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" 表格栏位数目，只是让浏览器在下载表格时先画出整个表格而已。   贴图格式帖图基本格式如下： <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" 设定先显示低解析度的图片，若加入的是一张很大的图片，下载要很长的时间，这张低 解析度的图片会先被显示以免浏览者失去兴趣，通常是原图的黑白版本。   1\HTML 标记一览   <HTML> ● 文件声明 让浏览器知道这是 HTML 文件  <HEAD> ● 开头 提供文件整体资讯  <TITLE> ● 标题 定义文件标题，将显示于浏览顶端  <BODY> ● 本文 设计文件格式及内文所   原代码<!--注解--> ○ 说明标记 为文件加上说明，但不被显示  <P> ○ 段落标记 为字、画、表格等之间留一空白行  <BR> ○ 换行标记 令字、画、表格等显示于下一行  <HR> ○ 水平线 插入一条水平线  <CENTER> ● 居中 令字、画、表格等显示于中间 反对 <PRE> ● 预设格式 令文件按照原始码的排列方式显示  <DIV> ● 区隔标记 设定字、画、表格等的摆放位置  <NOBR> ● 不折行 令文字不因太长而绕行  <WBR> ● 建议折行 预设折行部位   <TABLE borderColor=#cccccc cellSpacing=2 cellPadding=3 width="100%" bgColor=#ffffff border=1> <TBODY> <TR> <TD> </TD></TR></TBODY></TABLE>    空格码 cellspacing="2" 表格格线的厚度 border=1>边框粗细 width="100%"边框的宽度 borderColor=#cccccc 边框颜色 bgColor=#ffffff 背景颜色 cellPadding=3边距

分享到：        

阅读(63)| 评论(0)| 转载 (5) |举报