個人檔案关灵的树洞相片部落格清單更多  |  工具 說明 |
|
12 July Space秘笈以下章节原创：Loadmemory,在此深表感谢!
第一讲 初期准备 首先确认你的IE浏览器工具栏中是否有“链接（Link）”这一项，如果没有，那么点击“查看”菜单，在“工具栏”选项中将“链接（Link）”挑上勾。然后访问下面这个网站： http://www.siteexperts.com/blogging/editit.htm 你会发现页面中有一个“Edit It”链接，用鼠标右键点击这个链接，然后将其添加到收藏夹内，记着一定要放到“链接（Link）”这个文件夹中。按照上述操作后，你会在你的“链接（Link）”工具栏内看到一个“Edit It”的链接图标。 Ok，到你的MSN Space中新添加一篇日志，输入文字前，点击“Edit It”，看一看编辑工具栏是不是多出了几个图标，剪切、复制、粘贴、字形、字号都有了，再配合原来的加粗、斜体、文字颜色等，处理文本应该绰绰有余了。
第二讲 缤纷背景 编辑日志之前，先点击上一讲提到的那个“Edit It”按钮，然后选取编辑区域下方的HTML语法编辑选项，即将Use HTML to create your page选项挑上勾，此时即进入HTML编辑状态，你会看到页面上有如下标记<p></p>。将下列语句放置到编辑页面中： <div style="width:100%;height:100%;background-color:#990000;"><p>日志文字</p></div> 在<p>和</p>之间试着打几个字，然后点击预览日志，可以看到日志的背景颜色已经改变。当你想更改不同色彩的时候，只需将#990000这个颜色编码的数值加以调整就行了（注意不要丢了这个符号#）。如何获取自己心仪的色彩的数值呢？如果你手头有图形处理软件或网页编辑软件，使用里面的调整色彩功能，都会获取相应的数值。另外你也可以参考我提供色版。 在HTML编辑状态你会发现，文本编辑按钮都消失了，这种情况下处理起文字来可是有些困难，当然对高手来说，区区几个语句就能解决问题，但我们普通大众可没这本事和耐心。怎么办？好办！将Use HTML to create your page选项前的勾勾挑下去，即取消HTML语法编辑状态就可以了。这时你会发现，我们重新进入了文本编辑模式，但这里已不是一片空白，而是多了一个色块，在色块内双击鼠标，下面对文字的编辑就是轻车熟路了。 一个色彩还不够丰富，我想要五颜六色的生活!没问题，重新回到HTML语法编辑状态，在你想使用其他色彩的文字前再加入上面HTML语句，然后调整色彩值。这里还需注意两点：一是仍然注意要把文字部分嵌套在上述语句中，二是为达到最佳效果必须调整提供不同色彩的HTML语句中的高度比值，至于什么值比较合适，就得根据文字内容的长短了，你可以边调整，边预览之。
第三讲 立体彩色边框 拥有了背景色彩的日志显得生动活泼了许多，那么如何让她更具特色呢？在这一章里我将向大家讲述如何定制具有立体效果的背景样式。 我们先从为日志文字添加带有色彩的边框说起，因为其涉及到的CSS边框属性语法是以后制作立体效果边框的基础形式。请记住下面这段语法： <div STYLE="border-style:solid;border-width:5pt; border-color:red">日志文字</div> 它会在你的文字外围生成一个红色边框，border-width控制边框的粗细，border-color调整边框的颜色，这里你仍然何以使用前文提到的形式如#xxxxxx的颜色数值，而border-style则控制边框的效果，当使用“solid”则为单一颜色的线形简单边框。 接下来我们再将上述语法扩展一下，就可以获得具有立体效果的彩色边框。那么从何下手呢？其实就是在border-style后面使用不同的语法描述: Solid 简单线形边框 Double 简单双线边框 Groove 沟线立体效果边框 Ridge 脊线立体效果边框 Inset 嵌入线立体效果边框 Outset 浮出线立体效果边框 你可以在MSN Space日志中尝试一下上面不同的语法，然后在预览中观看效果。 通过定制边框的方法再将上一教程添加色彩的语法嵌套其中，你就可以创造出具有立体效果的彩色日志背景。 例如：<div STYLE="border-style:outset;border-width:2pt; border-color: red"> 使用上述语法将会为你呈现一个黄底色红边框的浮出线效果背景，其实上述语法还有其他形式的简化写法，这里不再赘述，只采用上述较直接易理解形式。 对于背景边框的四个边你也可以按自己的需要进行调整，以左边框为例，你可以使用下述语法： Border-left-style:solid (double, groove, ridge, inset, outset)定制边框样式 其他三个边框只要分别使用Right, Top, Bottom就可以了。将下面的语法放到你的日志中预览一下，看一看是什么效果： <div style= "border-top-style:outset;border-right-style:outset;border-left-style:outset; 你可以按照自己的想法随意调整四个边框的式样，以便创造与众不同的效果，记住一点，不同的属性描述之间用 ; 隔开。另外，你可能会注意到，当你设置完边框返回到日志文本编辑模式，在键入文字过程中如果使用回车键，就会又出现一个边框，从而影响文字的连贯性，这是因为HTML语法中不支持硬回车。要解决这个问题，必须返回到HTML编辑模式，在需要回车的地方键入<br>，需要几次回车就键入几个<br>，然后再返回到文本编辑模式，你就会发现边框背景内已经为你加入了回车后的效果。
第四讲 如何添加背景音乐 <P><IMG height=0 loop=infinite dynsrc=音频文件链接地址 width=0 border=0></P> 此段语法中唯一需要你更改的就是Loop，它控制循环播放的次数，当为infinite时是无限循环，为0时是不循环，其他循环次数只需键入相应数字即可。
第五讲 如何添加视频 <P><IMG height=150px width=150px loop=infinite dynsrc=流媒体文件链接></P> IMG后的Height和Width分别控制视频画面的高度和宽度，你可以根据需要自行调整，如果这里你都设置成0的话，那么就只有音乐看不到图像，这也等同于插入背景音乐的效果。Loop控制循环次数，用法可参见上一章的描述。 对于页面中视频位置的控制，可以使用日志编辑器里简单命令，另外也可通过加入下述语法实现视频与文字的完美结合。举例如下： align=left 文字置于视频的右边，并与其紧密结合 这里关键是流媒体文件的获取，正常的流媒体文件以asf，wmv，或mov等为后缀，这是最直接的形式；也有以asx为后缀的，这种文件格式隐藏了流媒体的真正地址，但没有关系，你一样可以将带有asx后缀的链接放到你的语法中。目前网上多数流媒体文件都隐藏了其链接，很难通过直接的方法来查看，有关这方面的破解技巧网上多有提供，大家可以试试。
第六讲 添加计数器和MSN在线状态指示器 计数器和MSN在线状态指示器是两个比较实用的工具，通过前者你可以了解自己空间的受欢迎程度，而后者又为来访者提供了你目前的在线信息，方便好友与你及时联系。为日志加入这两项功能的前提是你必须已经安装了HTML语法扩展编辑工具，也就是你的IE浏览器工具栏里已经拥有了“Edit It”按钮。如何获取此项功能，我已经在教程的你一章作了详细介绍，这里不再赘述。 先说说添加计数器。如果只是在日志中显示来访总数，那么申请一个简单的计数器即可，提供这种服务的网站很多，你在搜索引擎中键入“Free Web Counter”会查找到很多结果，这里我个人推荐http://www.amazingcounters.com/。这个网站提供350多种计数器，款式繁杂，花色多样，绝对满足你的需要。申请时需要注册，但过程很简单，一般只需要提供少量的个人信息即可。注册成功后你就可以选择心仪的计数器了，然后再输入你个人网站的信息，你将获得一段在线生成的HTML页面的代码。某些网站还会提供给你简单的在线编辑功能，让你进一步对计数器的外观作简单的修改，以更好的适合你的需要。将获取的代码拷贝，然后转到你需要插入计数器的MSN Space日志，点击“Edit It”按钮，进入HTML语法编辑状态，将刚才获取的代码粘贴到空白处，再退出HTML编辑状态，在日志文本处理模式下调整计数器的位置。由于MSN Space空间没有提供置顶功能，因此你必须经常调整计数器的位置，将它始终放置在首页的日志中（最好是第一篇日志）。方便起见，你可以将计数器的源代码拷贝到文本文件中，以后调整时将它简单粘贴过来就可以了。 如果你想获得有关你的空间流量的具体信息，诸如单位时间内的访问量，来访者停留时间，来访者IP及所在国家等等众多专业统计结果，上述网站就不能满足你的需要了。推荐你到这个网站申请此项服务：http://www.statcounter.com/，它提供了极其强大且稳定可靠的统计功能，几乎面面俱到（至少对于我们这个水平是足够了），而且众多信息均以图形或表格的方式予以呈现，直观明了（Tucow五星推荐）。所有这些服务均为免费，除非你的月访问量超过20万。唯一的缺点就是提供的计数器样式过于简单，可供选择的余地也不大。。它的申请过程很简单，成功后会先让你选择计数器样式（你可以进行简单的定值），然后设定某些参数，诸如通过Cookie功能将你自己的登陆排除在统计数字之外等，之后你可以在Install Code页面获取HTML代码，需要注意的是，它会为不同类型的页面生成不同的代码，因此你要在“Statcounter Code Option”里选择“Html Only Code”，通过这个命令生成的代码才可用于MSN Space，获取代码后的操作就和上面已降解的方式一样了。由于是海外的服务商，所以页面信息全部是英文，这对于不谙E文的朋友可能有些麻烦。 申请MSN在线状态指示器也很简单，到下面这个网站http://snind.gotdns.com:8080/ 在“Messenger”下拉菜单里选择MSN，当然如果你有Yahoo，或AOL等提供的及时通讯工具，也可以为其申请相应的指示器。输入你的MSN Messenger用户名，网站很快会为你生成一段代码，这段代码显示的是一个图标，通过其颜色的变化来显示你的Messenger的不同状态，直接将此代码按上述方法添加到日志中就可以了。有两个问题需要注意：该状态指示不会实时更新，它显示的状态是访问者登陆你的空间时你的在线状态，如果你在此期间上线或离线，指示器不会实时同步做出反应，除非刷新页面才会看出变化。另外显示的状态和真实状态可能会有稍许延迟，但不严重。还有一种情况也可能会发生，就是服务商的Server关机，那么指示器就无法正确显示任何状态了。
第七讲 文字光影效果及滚动文本框 下面就给大家介绍我在日志中展示过的三种彩色文字效果的相关语法： 阴影：<FONT style="COLOR: #xxxxxx; FILTER: shadow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 20pt; WIDTH: 100%"><B>日志文字</B></FONT> 发光：<FONT style="COLOR: #xxxxxx; FILTER: glow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 20pt; WIDTH: 100%"><B>日志文字</B></FONT> 模糊：<FONT color=#xxxxxx style="FILTER: blur(add=1, direction=40,strength=10); FONT-SIZE: 30px; FONT-WEIGHT: bolder; WIDTH: 200px">日志文字</FONT> 三种效果的语法格式基本相同，只不过使用了不同的滤镜属性。Color控制文字的颜色；Filter控制不同的滤镜效果，其内部的具体参数，诸如阴影及发光的色彩、模糊的方向及强度都可以按照需要自由调整；注意各效果语法中Width这个参数，当你的字号大小有所变化的时候，你也需要相应调整此项值，否则会造成文字无法正常排列的结果。另外，模糊效果中的Add 意为是否保留原效果，取值为0 or 1，一般设为1即可。其他方面的参数没有太多需要强调的，这里之所以采用华文彩云字体同时加粗，是为了达到更好的效果，你完全可以按照自己的喜好加以调整。需要说明的是，这几种效果只适用于标题或少量文字上，否则后造成阅读上的困难。 大篇幅的日志会占据页面的大部分空间，从而影响整体的美观性，而通过为其添加一个带有滚动条的文本框，则能够很好地解决上述问题。下面就是相关语法： <DIV align=center 上述语法生成一个带有黑色背景及灰蓝色边框的文本滚动框。语法里的参数相当简单，主要是控制不同部分的色彩，你可以做相应变化并在预览中观看实际效果。至于调整文本框的大小，你可以在插入此语法后退出HTML编辑模式，然后在日志编辑页面使用鼠标直接进行调整。
第八讲 为日志添加背景图片 首先进入正常日志编辑模式，键入你所需的日志内容，并视个人需要进行排版编辑。然后点击“Edit It”按钮，进入HTML语法编辑模式，并勾选下面的“使用HTML格式建立网页”。 <IMG src="背景图片链接地址" width=图片宽度值 height=图片高度值 align=right style="FILTER: alpha(opacity=100, finishOpacity=0,style=2) "> 再将你刚刚编辑好的文字内容（注意，除了文字内容可能还会包含你进行格式编排后的若干语法语句）剪切并粘贴到上面语法中的“你的日志文字”的位置。 下面简要介绍一下上面语法中的两行主要命令语句的含义： <IMG src=…….>控制日志中的背景图片，图片的宽度及高度值均以px为单位；align这一参数控制图片位置，但不要对此进行更改，否则无法实现文字浮于图片之上的效果。Filter控制背景图片的柔化滤镜，大家可以修改其中的数值已达到不同的效果，但注意style的值只能取1，2，3这三个数值。除了柔化效果外，还有翻转、发光、阴影等若干特效，但语法表述各有不同，在此不再赘述，有兴趣的朋友可以在互联网上查询相关语法。在Space空间不同的布局方式下，日志宽度是不相同的，所以为了更好的配合日志的页面效果，建议选择合适宽度的图片，具体可根据布局的实际情况（即日志的宽窄程度）将图片宽度分别设定在260px、350px、370px、550px、730px左右的近似值。 <DIV style="FILTER…….>控制日志文字的若干效果，其中Filter命令的使用方法与前述一致，也是调节柔化效果。文本宽度也采取px为单位，其最大值也要参照上面不同布局方式时所要求的近似宽度值，如果你希望文字完全分布在整个日志页面上，那么将WIDTH值设为100%即可。在设定了具体宽度的情况下Float命令可以省略，否则请予以保留。 有一个问题需要注意，预览中文字相对于背景图片的位置往往与最终显示在日志中的位置不一样，这还需要你返回到该日志进行进一步的修改，这确实需要一些耐心，但相信经过一段时间的实际应用，你会总结出一些经验技巧的。
1.msnspace模板-文字竖排 DIV style="WRITING-MODE: tb-rl; TEXT-ALIGN: left"> 这个语法中唯一的亮点就是Writing-Mode这个参数，其后的tb代表文字排列从上到下，rl代表从右到左。
2.msnspace模板-虚线框 <div style="border: 1px dashed #000000;background-color:#FFFFE0"> </div>
3.msnspace模板-文字背景色 <font style="BACKGROUND-COLOR:#ddccff">文字</font>
4.msnspace模板-发光文字 <FONT style="FONT-SIZE: 20pt; FILTER: glow(color=black); WIDTH: 100%; COLOR: #0fd0fd; FONT-FAMILY: 宋体" color=#99ff99><B></B></FONT> color=black可以换作：color=#66cc66等颜色代码，color=#99ff99也一样。
5.msnspace模板-立体的文字效果 代码不发了，大家直接把这个粘贴到编辑页面就行啦。 立体的文字效果 Verdana 立体的文字效果 Verdana 立体的文字效果 Verdana 立体的文字效果 Verdana 立体的文字效果 Verdana 立体的文字效果 Verdana 立体的文字效果 Verdana 立体的文字效果 Verdana <P><FONT style="FONT-SIZE: 12pt; FILTER: Shadow(color=#4A7AC9,direction=135); HEIGHT: 19pt" face=Verdana color=#ffffff>立体的文字效果</FONT></P>
6.Msn Space模板-图片阴影 图片的阴影效果（原理与文字阴影是一样的）：  <DIV style="FILTER: Dropshadow(color=#cccccc,offX=4,offY=4); OVERFLOW: visible; WIDTH: 415px; HEIGHT: 315px"> 将http://www.sucai123.com/img2008/13/09/20031025027a_2.jpg换成你所要显示的图片即可 7.Msn Space模板-flash
<DIV align=center>
<P><A href="javascript:document.getElementById('playflash').innerHTML='<embed width=400 height=300 src=http://www.htxx.com.cn/flash/song/lemontree.swf> </embed>';document.getElementById('playflash'). releaseCapture();"><U><FONT color=#019bcf>播放</FONT></U></A></P> <DIV id=playflash style="WIDTH: 372px; HEIGHT: 300px; BACKGROUND-COLOR: #ffffff"></DIV></DIV> 说明：将 http://www.htxx.com.cn/flash/song/lemontree.swf 改为你所要用的地址
WIDTH: 宽度; HEIGHT: 高度。
用javascript:document.getElementById('playflash').innerHTML='<embed%20width=400%20height=300%20src=http://netmag.go3.icpcn.com/flash/8.swf>%20</embed>';document.getElementById('playflash').%20releaseCapture();这样的方法，还可以做到更多吧！ 比如音乐插件 这样“有待解决的问题……”中就有两项可以解决了。 p.s. 原来是小绿人想到的…… 大陆的朋友们要加油啊！！
8.Msn Space模板-图片链接 Msn Space模板-图片链接
代码：<P align=center><FONT size=-1><A href="http://spaces.msn.com/members/kiogal" target=_top><FONT size=2><IMG style="WIDTH: 400px; HEIGHT: 315px" height=348 src="http://www.sucai123.com/img2008/13/09/20031025027a_2.jpg" width=406 align=top border=0></FONT></A></FONT></P> 将http://spaces.msn.com/members/kiogal换成你要用的地址，http://www.sucai123.com/img2008/13/09/20031025027a_2.jpg 换成你要用的图片就可以了。
9.Msn Space模板-添加链接 代码： <A href=http://spaces.msn.com/members/kiogal target=_blank>Msn Space模板</A> 效果： 说明：<A href="地址" target=_blank（新建窗口打开，可换为self 在当前页打开）>文字</A>
10.回到主页 <P> </P> 将http://spaces.msn.com/members/kiogal/#BlogViewId换成你想要的网址。
在此表示衷心地感谢！
1,★帖图常用特效代码★ 原图片如下：
效果一：
代码如下： <IMG src="http://cry.shidabbs.com/home/bbsjc/images/jchanxing.jpg" style="FILTER: gray(color=#ffedff)"> 效果二：
代码如下： <IMG src="http://cry.shidabbs.com/home/bbsjc/images/jchanxing.jpg" style="FILTER: xray(color=#ffedff)"> 效果三：
原代码如下： <IMG src="http://cry.shidabbs.com/home/bbsjc/images/jchanxing.jpg" style="FILTER: invert(color=#ffedff)"> 效果四：
代码如下： <IMG src="http://cry.shidabbs.com/home/bbsjc/images/jchanxing.jpg" style="FILTER: fliph(color=#ffedff)"> 效果五：
代码如下： <IMG src=http://cry.shidabbs.com/home/bbsjc/images/jchanxing.jpg style="FILTER: flipv(color=#ffedff)"> 效果六：
原代码如下： <img src="http://cry.shidabbs.com/home/bbsjc/images/jchanxing.jpg" width=380 height=147 style=filter:Alpha(opacity=100,style=2)>
原代码如下：<P align=center><FONT style="FONT-SIZE: 27pt; WIDTH: 220px; COLOR: #00ff00; HEIGHT: 10px"><IMG src="http://cry.shidabbs.com/home/bbsjc/images/fanc.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://cry.shidabbs.com/home/bbsjc/images/fanc.gif"></FONT></FONT></P>
原代码如下： <MARQUEE behavior=alternate direction=up height=300 width=130><img src=http://cry.shidabbs.com/home/bbsjc/images/die1.gif></MARQUEE><FONT color=orange><MARQUEE behavior=alternate direction=up height=250 width=130><img src=http://cry.shidabbs.com/home/bbsjc/images/die1.gif></MARQUEE><FONT color=Fuchsia><MARQUEE behavior=alternate direction=up height=300 width=130><img src=http://cry.shidabbs.com/home/bbsjc/images/die1.gif></MARQUEE><FONT color=olive><MARQUEE behavior=alternate direction=up height=250 width=130><img src=http://cry.shidabbs.com/home/bbsjc/images/die1.gif></MARQUEE> ——取自m1net
<DIV class=LayoutIBeam style="TABLE-LAYOUT: auto; DISPLAY: block; LEFT: Apx; WIDTH: Bpx; TOP: Cpx; BORDER-COLLAPSE: separate; HEIGHT: Dpx"><IMG src="图片地址链接" border=0></DIV> 将图片可浮动的范围想象成一个虚拟矩形框： 原创：还猪哥哥
具体步骤: 1.在 "主页 档案文件 | 网络日志 | 照片 | 列表 "五项中点击照片，然后再打开页面中找到想要做成背景的照，点右键，弹出菜单中选择“复制”； 2.在编辑新的网络日志的状态下，粘贴照片，然后在“用 HTML 创建您的网页。 — 直接编辑 HTML 格式命令”前面打钩儿，会出现一个类似src=图片链接地址 width=431 fOriginalInfoSaved="true" iHeight="323" iWidth="431"></P>的格式，刚、则 3.将取得的URL在“用 HTML 创建您的网页。 — 直接编辑 HTML 格式命令”替换<IMG src="背景图片链接地址" width=图片宽度值 height=图片宽度值 align=right style="FILTER: alpha(opacity=100, finishOpacity=0,style=2) ">
下面两个很重要的代码要特别的感谢恪纯先生(浮云旧事温柔)http://spaces.msn.com/members/flowersummer/
<DIV class=LayoutIBeam style="TABLE-LAYOUT: auto; DISPLAY: block; LEFT: 600px; WIDTH: 468px; TOP: 126px"><IMG height=13 alt="Web page counters" src="http://www.amazingcounters.com/counter.php?i=106790&c=320683" width=63 border=0></DIV> 第一段中红色部分为计数器代码。 我的免费计数器是在http://www.amazingcounters.com申请的，注意：请复制这段代码的朋友将红色计数器代码部分替换为自己申请的计数器代码。
<DIV class=LayoutIBeam style="TABLE-LAYOUT: auto; DISPLAY: inline; LEFT: 800px; TOP: 123px; BORDER-COLLAPSE: separate"> 列表内容包括计数器、图片、计数器、文本等，也可以取消了HTML状态后以直观的方式直接添加，我空间右侧的图书链接就是从原来左侧的列表中直接复制过去的。
LEFT: 范围左边的距离.
<DIV align=right>
<DIV align=center> 其中，A为你要定义的视频的高，B为你要定义的视频的宽~其它标注红色的地方计算出相应数值填入即可。src=加载图片地址，如无加载待机图或不打算使用，请去掉此语句。
引用通告此內容的引用通告是： http://guanling.spaces.live.com/blog/cns!F166C7CC51C30A4E!262.trak 引述這則內容的部落格
|
|
|
