ProfileMsn Space 从入门到精通PhotosBlogLists Tools Help
My Custom Part|false|
January 11

教程13:如何在msn space添加一个计数器

by gouy2k

(转贴请注明原作者和出处)   

 

              

在看本篇前请现看: 浅谈如何在msn space使用html代码

 

步骤一:申请计数器

 

这里我用来举例说明的计数器是Statcounter:http://my.statcounter.com. 因为我认为这个计数器虽然不花哨,但是相当稳定。

先来到主页:http://my.statcounter.com

 

 

 

 点击页面上的注册来到:

填好上面资料,按Register my account 继续:

从上面页面来到:

继续来到计数器网站设置:

完成上面後按next继续:

 

 

然后来到:

完成上面後,按next来到:

再来到最后的计数器样式设置:

 

然后选择代码类型:

按next来到最后一步:

 完成上图步骤後按next就可以获得代码了:

 

步骤二: 放置代码

 

得到代码後,我们要先精简代码,原来代码为:

<a href="http://www.statcounter.com/" target="_blank"><img src="http://c11.statcounter.com/counter.php?sc_project=1188869&amp;java=0&amp;security=18f57dd9&amp;invisible=0" alt="site hit counter" border="0"></a>

我们可以把代码精简为:

<img src="http://c11.statcounter.com/counter.php?sc_project=1188869&amp;java=0&amp;security=18f57dd9&amp;border="0">

 

把精简过的代码放到日志内或者custom html里面,具体请看:浅谈如何在msn space使用html代码

更多的免费计数器资源请看:可以供msn space使用的免费资源

January 10

教程12:如何为你的日志添加滚动条

by gouy2k

(转贴请注明原作者和出处)

 

在看本篇前请现看: 浅谈如何在msn space使用html代码

 
 
为何不让文章过长而影响页面效果,我们可以在发表日志的时候使用滚动条效果,比如:
 
 

臣亮言:先帝创业未半,而中道崩殂;今天下三分,益州疲敝,此诚危急存亡之秋也。然侍卫之臣,不懈于内;忠志之士,忘身于外者:盖追先帝之殊遇,欲报之于陛下也。诚宜开张圣听,以光先帝遗德,恢弘志士之气;不宜妄自菲薄,引喻失义,以塞忠谏之路也。宫中府中,俱为一体;陟罚臧否,不宜异同:若有作奸犯科,及为忠善者,宜付有司,论其刑赏,以昭陛下平明之治;不宜偏私,使内外异法也。侍中、侍郎郭攸之、费依、董允等,此皆良实,志虑忠纯,是以先帝简拔以遗陛下:愚以为宫中之事,事无大小,悉以咨之,然后施行,必得裨补阙漏,有所广益。将军向宠,性行淑均,晓畅军事,试用之于昔日,先帝称之曰“能”,是以众议举宠为督:愚以为营中之事,事无大小,悉以咨之,必能使行阵和穆,优劣得所也。亲贤臣,远小人,此先汉所以兴隆也;亲小人,远贤臣,此后汉所以倾颓也。先帝在时,每与臣论此事,未尝不叹息痛恨于桓、灵也!侍中、尚书、长史、参军,此悉贞亮死节之臣也,愿陛下亲之、信之,则汉室之隆,可计日而待也。

 

基本语法:

滚动条效果我们使用的是css中的overflow属性. overflow属性有四个基本属性置,为:

visible:扩大面积以显示所有内容。
hidden:隐藏超出范围的内容。
scroll:在元素的右边显示一个滚动条。
auto:当内容超出元素面积时,显示滚动条。

 

控制横竖滚动条的参数为:

overflow-x (横滚动条)

overflow-y (竖滚动条)

 

控制滚动条个部分参数为 (在线滚动条调色器:点击进入):

scrollbar-3d-light-color立体滚动条亮边的颜色
scrollbar-arrow-color上下按钮上三角箭头的颜色
scrollbar-base-color滚动条的基本颜色
scrollbar-dark-shadow-color立体滚动条强阴影的颜色
scrollbar-face-color立体滚动条凸出部分的颜色
scrollbar-highlight-color滚动条空白部分的颜色
scrollbar-shadow-color立体滚动条阴影的颜色
 
 
举个最简单的例子例说明,就是最开始那个例子的代码:
<DIV style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; FONT-SIZE: 12px; OVERFLOW: scroll; BORDER-LEFT: 1px solid; WIDTH: 426px; LINE-HEIGHT: 20px; BORDER-BOTTOM: 1px solid; HEIGHT: 122px">
<P>臣亮言:先帝创业未半,而中道崩殂;今天下三分,益州疲敝,此诚危急存亡之秋也。然侍卫之臣,不懈于内;忠志之士,忘身于外者:盖追先帝之殊遇,欲报之于陛下也。诚宜开张圣听,以光先帝遗德,恢弘志士之气;不宜妄自菲薄,引喻失义,以塞忠谏之路也。宫中府中,俱为一体;陟罚臧否,不宜异同:若有作奸犯科,及为忠善者,宜付有司,论其刑赏,以昭陛下平明之治;不宜偏私,使内外异法也。侍中、侍郎郭攸之、费依、董允等,此皆良实,志虑忠纯,是以先帝简拔以遗陛下:愚以为宫中之事,事无大小,悉以咨之,然后施行,必得裨补阙漏,有所广益。将军向宠,性行淑均,晓畅军事,试用之于昔日,先帝称之曰“能”,是以众议举宠为督:愚以为营中之事,事无大小,悉以咨之,必能使行阵和穆,优劣得所也。亲贤臣,远小人,此先汉所以兴隆也;亲小人,远贤臣,此后汉所以倾颓也。先帝在时,每与臣论此事,未尝不叹息痛恨于桓、灵也!侍中、尚书、长史、参军,此悉贞亮死节之臣也,愿陛下亲之、信之,则汉室之隆,可计日而待也。 <BR></P></DIV>

 

 

上面代码: BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 1px solid; BORDER-BOTTOM: 1px solid 代表上下左右边界的特性为solid, 1px.

OVERFLOW: scroll代表scroll:在元素的右边显示一个滚动条。

WIDTH: 426px;HEIGHT: 122px:代表整个界面的高和宽。

LINE-HEIGHT: 20px表示文字的行高。

 

更多滚动条样式效果请参考爬上虎的:页面特技系列之七(各种样式的滚动文本框)

January 07

教程11:如何给你的日志添加背景

by gouy2k

(转贴请注明原作者和出处)

 

在看本篇前请现看: 浅谈如何在msn space使用html代码

 
msn space现在使用最广泛的日志背景是使用table背景的方式,就是建立一个table,然后在table上加上背景,再在table内输入文字或其他,如下面范例:
 
 
 
 添加办法:
 
我们使用一段简单的代码示范如何添加背景:
 
显示为:
 
代码为: 

<DIV align=center>
<TABLE style="BACKGROUND-POSITION: center center; BACKGROUND-REPEAT: repeat" height=500 width=378 background=图片地址>
<TBODY>
<TR>
<TD vAlign=top align=middle>

<FONT style="FONT-SIZE: 9pt" size=4><FONT color=#0000ff><FONT color=#000000 size=4><STRONG>

<BR>文字<BR>文字<BR>文字 </STRONG></FONT><BR></FONT></FONT></TD></TR></TBODY></TABLE></DIV>

 

上面的代码是利用一个一行一列表格做出来的日志背景效果,分析代码:


<TABLE style="BACKGROUND-POSITION: center center; BACKGROUND-REPEAT: repeat" height=500 width=378 background=图片地址>

这段代码表示背景在table中的位置(BACKGROUND-POSITION: center center),属性(BACKGROUND-REPEAT: repeat),长(height=500),宽(width=378),以及背景图片的地址 (background=图片地址)。


<TD vAlign=top align=middle>

这个代码是指文字在表格里的位置。


<FONT style="FONT-SIZE: 9pt" size=4><FONT color=#0000ff><FONT color=#000000 size=4><STRONG>

这段代码是位子的属性,包括大小(="FONT-SIZE: 9pt" size=4), 颜色(FONT color=#0000ff),字形(strong)。


<BR>文字<BR>文字<BR>文字

这段是显示在背景上的文字,<br>是换行,如果不使用换行代码,那么文字就会在表格框尽头自动换行。


如果你看不懂上面说什么,没关系,这里介绍一个所见既所得的工具给你:网志背景产生器。先感谢小绿人为大家提供了这么好的工具。

 

调试好後只要把得到的代码粘贴到编辑日志模式的html模式下(关于在msn space使用html代码请看:浅谈如何在msn space使用html代码 )。

分享个 windows live messenger 测试邀请(没有了)

 
 
 使用msn messenger频率高又对新版Windows Live Messenger有兴趣的朋友请在此留下自己的hotmail或者msn邮箱如果你不经常使用messenger请不要申请,或者你使用的不是windows xp请补要申请,以免浪费 (这些邀请已经在ebay买到了10-20美元)一个, 谢谢合作。
 
注:Windows live messenger就是msn messenger的下一个版本,以后不会再有msn messenger这个名称。用的和msn mesenger是一个帐号,只是没有收到测试邀请的人就算下了Windows live messenger也不能登陆 (除非使用非法的补丁)。
January 06

教程10:浅谈如何在msn space使用html代码

by gouy2k

(转贴请注明原作者和出处)

灵活利用html代码可以让你的msn space和日志变的更加多姿多彩,现在基本介绍一下如何msn space使用html代码。

 

注意:msn space只能使用部分基本的html代码,象插入多媒体体,iframe等都不支持。

 

在msn space上,有两个地方可以使用html代码,一是在日志中,另外一个是在custom html模块。

 

1.在日志中

 

来到日志编辑模式中:

 

 点击html转换到html编辑模式

 

 举例说明:

 

再举个反例:

 

2.在custom html模块中 (如何添加此模块请看:点击观看。微软官方限制只能在custom html内添入512字符。 )

添入需要的html代码,并保存

 

去预览我的共享空间可以看到效果

 

更多关于各种html代码的使用请看 http://spaces.msn.com/members/stationsix/

 

教程9: 如何使用msn space的相册

by gouy2k

(转贴请注明原作者和出处)

 
如果你的msn space还没有田间相册模块,要先添加,步骤为
 
先来到管理后台,点击自定义-模块-相册
 
 
然后把相册模块移动到适当的位置後按保存:
 
 
添加好後就可以开始创建相册和添加照片了,点击创建,如下图
 
 
然后来到如下页面:
 
改好相册名称後,按添加照片选择上传照片:
(注意,第一次上传相片会要求安装一个插件,统一安装就可以了)
 
上传前可以对照片进行简单编辑:
 
弄好後就可以点击“立即上载”开始上传了
 
穿好後来到下面页面,按“保存并关闭”完成
 
回到管理楼台看到如下:
 
 
点击下图菜单上的照片就可以浏览大图了
 
 
技巧
 
1. 如何获得相册里图片的地址
 
先来到浏览相册大图的地方,然后在想知道地址的图片上点鼠标右键:
 
选择属性後就可以看到地址了:
 
2.如何调整多个相册的顺序
 
 先用IE等如自己的msn space管理后台,直接在相册模块上用鼠标上下拖动需要调整顺序的相册就可
以了:
 

教程5:如何帮你的space做一个留言本

by gouy2k

(转贴请注明原作者和出处)

 

其实做个留言本很简单,步骤如下

 

步骤 1

 

首先去到你的space的管理后台,选择添加一篇新日志:

把这篇日志起名为“留言本”, 然后在里面写上你想给别人看的话,然后发布这篇日志:

发布好日志後回到管理后台,按右上角的“预览我的共享空间”,如下图:

来到预览页面後,找到这个日志,按日志下面的“固定连接”获得此日志的连接:

复制连接备用:

 

然后按编辑您的共享空间回到后台:

 

步骤 2

通过自定义-模块 添加一个自定义列表

添加好後把列表拖到适当位置,然后按编辑列表

 

先给列表重新命名:

 

然后添加一个新的项目:

 

填入你的之前拿来做留言本的那个连接:

 

填完後按保存就成功了,别人就可以通过点击这个一直在首页面的列表里连接给你留言了

 

注:这个留言本只能给hotmail或者msn的注册用户留言,如果你想其他人留言可以申请外部的免费留言本(获取免费资源)。然后根据上面教程的步骤2把留言本的连接放来space就可以了。

教程4:msn space 日志编辑工具栏详解

by gouy2k

(转贴请注明原作者和出处)

 

我就老作品,直接放过来用,原文地址:http://spaces.msn.com/members/gouy2k/Blog/cns!1pDY_zP0KmKKdbqxNm6bIQSw!1964.entry,2005年6月28号写的,就是msn space转换日志编辑工具栏当天。

  

今天早上msn作出了中大更新, 更新了编辑日志工具栏, 增加了之前edit it内的所有功能,至此,所有用户不用再手工添加edit it就可以享受琪所有功能,包括最重要的html编辑功能. 现在我就堆这个新工具栏进行详细的解释,告诉大家每一项的功能.其实这个和office word里面那个的功能是差不多的. 熟悉word的人可以不看都行.

 

 

 下面,我就对工具栏的每项功能进行解释

 首先,这三个按照次序分别是剪贴, 复制和粘贴文本,功能和鼠标右键菜单里的功能是一样的,功能就是对文本和图片进行剪贴, 复制和粘贴.

 

 

 

这三个是对字体进行控制, 第一个段落是按照主题或者正常大小进行字体控制

 

测试测试测试测试(主题一大小)

测试测试测试测试(地址大小)
 
第二个是选择字型,但是好像选择还不多, 没有利用到windows所带的全部字体,但是这个问题可以通过添加js快捷方式解决,这里不做介绍.
 
测试测试测试(宋体)
测试测试测试(黑体)
 
第三个字体大小是直接控制字体大小.
 
测试测试测试(特大)
 
 
 这三个是对文字进行特殊处理,分别是加黑,斜体,和下划线
 
测试测试测试(加黑)
测试测试测试(斜体)
测试测试测试(下划线)
----------------------------------------------------------
 
 
这三个是对段落对齐进行控制,分别是左对齐,中间对齐,右对齐.
 
测试测试测试(左对齐)
测试测试测试(中间对齐)
(右对齐)测试测试测试
--------------------------------------------------
 
 
这几个是对段落开头进行标识和控制段落位置.
 
第一个是添加段落编号
  1. 测试测试测试测试
  2. 测试测试测试测试
  3. 测试测试测试测试

第二个是在段落前添加重黑点进行标识

 

  • 测试测试测试测试
  • 测试测试测试测试
  • 测试测试测试测试

第四个是段落缩进

测试测试测试测试(按两次的效果)

测试测试测试测试

测试测试测试测试

 

第三个是段落突出,就是回复上面那个段落缩进用的.

 ---------------------------------------------------------------------------

 这三个是比较特殊的
 
第一个是插入行,效果如下
 

 
 
 就是插入了一条分割线分割上下文本

 
 
第二个是加入超连接,效果如下
 
 
 实现方法是选中所要的文字后按加入超连接然后添加连接,相信图片也可以实现,在添加过程里可以选择是否屏蔽所搜引擎跟踪,就是所谓的搜索机器人了. 
 
 
第三个, 可以点击high light的文字直接让制定搜索引擎搜索,默认引擎是微软自己的搜索引擎.比如搜索我的名字
 
-----------------------------------------------------------------
 
 
第一个是添加文字背景颜色,效果如下
 
测试测试测试 
 
测试测试测试
 
 第二个是改变文字颜色,效果如下
 
测试测试测试 
测试测试测试 
 
第三个是添加表情
------------------------------------------------------------
 
 
这个东西相信是整个工具栏里面最重要的,直接对日志进行html代码编辑. 之前很多space上的特殊效果,包括任意位置图片, 添加背景音乐都是通过这个实现的. 是什么? 你按了就知道了.
 
比如你要手工添加图片,代码如
<IMG style="BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; LEFT: 85px; VISIBILITY: visible; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid; TOP: 44px" height=384 src="http://storage.msn.com/x1p4JHjVbcjTC9h5WTAsy0WBd620IeIG2FiXqrJlOidfD5lRHYazrenZoUrMQM01O_rmDsHChZAjcNqxGzHJR9YEJ2eYz5DOb61l94g8F1TDpy2SnyGrzrZJZbVz71CyDlCBx4hdGxV8v1dvGbL34VHIA" width=571>
 
上面那个是在页面顶添加一个显示ip的动态图片的,记住,要添加代码实现特效一定在在html模式下进行,否则代码是直接现实的.
----------------------------------------------------------------------
 
最后,这个工具栏是可以自定义的,按最后那两个箭头可以出现下面的菜单
 
通过勾取,可以选择需要显示在工具栏的工具.
 
No list items have been added yet.

gouy2k gouy2k

3  
Photo 1 of 30