Windows LiveWindows Live™
 
 
Song's profileMSN Space技巧归总BlogLists Tools Help

Blog
    June 19

    MSN Space技巧---文字光影效果及滚动文本框（AND文字竖排版）

    有关文字方面的处理，MSN Space提供了最基本的几个格式化命令，再加上我们的扩展编辑工具，在应付一般的文字编排上应该是绰绰有余了。如果还想获得更多的效果，尤其是在文字排版方面，大家可以参考相应的HTML及CSS中有关文字处理的介绍，在这里就不做讲解了，毕竟我的教程只是给大家提供一些简单实用的小技巧，而并非网页制作方面的专业讲座。不过对于一些比较特殊的文字效果或编排方式，我还是会及时将有关语法和代码提供给大家。

     

    （注：下述语法的使用，仍然是通过HTML语言编辑模式来实现，有关如何获取HTML扩展功能，请参见本教程第一章）

     

    下面就给大家介绍我在日志中展示过的三种彩色文字效果的相关语法：

     

    阴影：<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
    style='
    color: #ffffff;
    background-color: #000000;
    border: solid 2px black;
    width: 120px;
    height: 200px;
    overflow: scroll;
    scrollbar-face-color: #889B9F;
    scrollbar-shadow-color: #3D5054;
    scrollbar-highlight-color: #C3D6DA;
    scrollbar-3dlight-color: #3D5054;
    scrollbar-darkshadow-color: #85989C;
    scrollbar-track-color: #95A6AA;
    scrollbar-arrow-color: #FFD6DA;
    '>日志文字</DIV>

     

    上述语法生成一个带有黑色背景及灰蓝色边框的文本滚动框。语法里的参数相当简单，主要是控制不同部分的色彩，你可以做相应变化并在预览中观看实际效果。至于调整文本框的大小，你可以在插入此语法后退出HTML编辑模式，然后在日志编辑页面使用鼠标直接进行调整。

     

    接下来说说文字竖排是如何实现的。除了制造特殊效果，我在Space空间展示的文字竖排没有什么真正的实用性，只会给阅读者造成麻烦，不过本着尽可能挖掘Space潜力的原则，我还是尝试了如下的语法：

     

    <DIV style="FONT-SIZE: 9pt; WRITING-MODE: tb-rl; TEXT-ALIGN: left"><p>日志文字</P></DIV>

     

    这个语法中唯一的亮点就是Writing-Mode这个参数，其后的tb代表文字排列从上到下，rl代表从右到左。

    感谢loadmemory的分享！




    词嘲墨尽

    您是第位朋友

    任何疑问请进入我的留言本

    1:00 PM | View trackbacks (11) | Blog it | MSN Space 基础教程

    Comments (119)

    Please wait...
    Sorry, the comment you entered is too long. Please shorten it.
    You didn't enter anything. Please try again.
    Sorry, we can't add your comment right now. Please try again later.
    To add a comment, you need permission from your parent. Ask for permission
    Your parent has turned off comments.
    Sorry, we can't delete your comment right now. Please try again later.
    You've exceeded the maximum number of comments that can be left in one day. Please try again in 24 hours.
    Your account has had the ability to leave comments disabled because our systems indicate that you may be spamming other users. If you believe that your account has been disabled in error please contact Windows Live support.
    Complete the security check below to finish leaving your comment.
    The characters you type in the security check must match the characters in the picture or audio.

    To add a comment, sign in with your Windows Live ID (if you use Hotmail, Messenger, or Xbox LIVE, you have a Windows Live ID). Sign in


    Don't have a Windows Live ID? Sign up
    No namewrote:
    046 2009.11.21 Do you know why <A href="http://www.newstylerolex.com/" title="Replica Rolex">Replica Rolex</A> will become fashionable? The reason is very simple: customers will be more
    or less on the product's merits. Let them feel fashionable. Good taste is the <A href="http://www.newstylerolex.com/" title="Cheap Brand Name Watches">Rolex</A> designs irresistible,
    but unfortunately, not everyone can accept the real <A href="http://www.watches-life.com" title="cheap price">Rolex</A>. The price is simply not acceptable, if you are
    not a millionaire. If the cost of car and your <A href="http://www.rolex-hot.com" title="cheaper price">Rolex</A>, as you will not pay the money to buy a real watch,
    but you'll love wearing <A href="http://www.rolex-hot.com" title="cheaper price">Replica Rolex</A> watches, because of low prices. Replica Watches are smart people's
    assistance, these two values <A href="http://www.enjoy-watches.com/" title="high quality watches">Rolex</A>, affecting the audience a good replica Rolex view. Senior replica Rolex
    application a long time, just like the real watch, so this kind of watch should be sold around the world.
    Swiss <A href="http://www.watches-life.com" title="cheap price">Replica Rolex</A> was considered the best ever
    <A href="http://www.watches-life.com" title="cheap price">Replica watches</A>, you can bet with anyone. They would
    certainly think that this is a real watch, and look forward to also have a kind of <A href="http://www.e-lv.net" title="Replica handbags">Replica handbags</A>. The idea
    of buying a <A href="http://www.enjoy-watches.com/" title="Brand Name Watches">Replica rolex</A>, you should not
    feel embarrassed. If you summon the courage to buy the best replica <A href="http://www.2g-3g.com" title="high quality timepieces">Rolex</A> and wearing a period of time,
    you will realize this is a fairly reliable watch, not just a good-looking replica. Replica
    <A href="http://www.vertuexclusiveshop.com" title="cheaper vertu">Vertu</A> does not mean low quality. It simply means that authentic than the
    famous Rolex short life. Now <A href="http://www.newstylerolex.com/" title="Brand Name Watches">Replica Watches</A> have
    become a strong competitor, because they strong attractive price and quality. Most of us can not perceive
    <A href="http://www.iphonebatteries.org/" title="Batteries,Phone Batteries">Phone Batteries</A> watches and
    <A href="http://www.sunglassvip.net" title="Welcome to our Replica Watches website">Replica rolex</A> genuine difference. It will
    take time and a lot of practice in order to do this, if at first glance, there can not distinguish between the.
    In fact, we have no need to use high prices to buy a genuine <A href="http://www.sunglassvip.net" title="high quality timepieces">Rolex</A>,
    because we have so many high-quality low price <A href="http://www.enjoy-watches.com/" title="Brand Name Watches">Replica Watches</A> to choose from.
    <A href="http://www.newstylerolex.com/" title="Brand Name Watches">Rolex Watches</A> will meet all your. It has a great design, it is
    of high quality materials into, and can accompany you for many years. What else would you expect? Looks like
    this precious replica <A href="http://www.newstylerolex.com/">Omega</A>, will certainly improve your self-confidence.046

    2 days ago
    No namewrote:
    0462009.11.16 Our website have many goods,<A href="http://www.newstylerolex.com/" title="Cheap Brand Name Watches">Rolex</A> -
    <A href="http://www.newstylerolex.com/" title="Replica Rolex">Replica Rolex</A> -
    <A href="http://www.newstylerolex.com/" title="Brand Name Watches">Replica Watches</A> -
    <A href="http://www.newstylerolex.com/" title="Brand Name Watches">Rolex Watches</A> -
    <A href="http://www.sunglassvip.net" title="Welcome to our Replica Watches website">Replica rolex</A> -
    <A href="http://www.sunglassvip.net" title="high quality timepieces">Rolex</A> -
    <A href="http://www.2g-3g.com" title="high quality timepieces">Rolex</A>
    <A href="http://www.watches-life.com" title="cheap price">Rolex</A>
    <A href="http://www.watches-life.com" title="cheap price">Replica Rolex</A>
    <A href="http://www.rolex-hot.com" title="cheaper price">Rolex</A>
    <A href="http://www.rolex-hot.com" title="cheaper price">Replica Rolex</A>
    <A href="http://www.vertuexclusiveshop.com" title="cheaper vertu">Vertu</A>
    <A href="http://www.vertuexclusiveshop.com" title="cheaper Replica vertu">Vertu Replica</A>,
    <A href="http://www.e-lv.net" title="Replica handbags">Replica handbags</A>,
    <A href="http://www.enjoy-watches.com/" title="high quality watches">Rolex</A>,
    <A href="http://www.enjoy-watches.com/" title="Brand Name Watches">Replica Watches</A>,
    <A href="http://www.iphonebatteries.org/" title="Batteries,Phone Batteries">Phone Batteries</A>,
    <A href="http://www.lrolex.com/">Rolex</A>,
    <A href="http://www.newstylerolex.com/">Omega</A>,I belive that you will like them !046
    Nov. 16
    No namewrote:
    046Our website have many goods,<A href="http://www.newstylerolex.com/" title="Cheap Brand Name Watches">Rolex</A> -
    <A href="http://www.newstylerolex.com/" title="Replica Rolex">Replica Rolex</A> -
    <A href="http://www.newstylerolex.com/" title="Brand Name Watches">Replica Watches</A> -
    <A href="http://www.newstylerolex.com/" title="Brand Name Watches">Rolex Watches</A> -
    <A href="http://www.sunglassvip.net" title="Welcome to our Replica Watches website">Replica rolex</A> -
    <A href="http://www.sunglassvip.net" title="high quality timepieces">Rolex</A> -
    <A href="http://www.2g-3g.com" title="high quality timepieces">Rolex</A>
    <A href="http://www.watches-life.com" title="cheap price">Rolex</A>
    <A href="http://www.watches-life.com" title="cheap price">Replica Rolex</A>
    <A href="http://www.rolex-hot.com" title="cheaper price">Rolex</A>
    <A href="http://www.rolex-hot.com" title="cheaper price">Replica Rolex</A>
    <A href="http://www.vertuexclusiveshop.com" title="cheaper vertu">Vertu</A>
    <A href="http://www.vertuexclusiveshop.com" title="cheaper Replica vertu">Vertu Replica</A>,
    <A href="http://www.e-lv.net" title="Replica handbags">Replica handbags</A>,
    <A href="http://www.enjoy-watches.com/" title="high quality watches">Rolex</A>,
    <A href="http://www.enjoy-watches.com/" title="Brand Name Watches">Replica Watches</A>,
    <A href="http://www.iphonebatteries.org/" title="Batteries,Phone Batteries">Phone Batteries</A>,
    <A href="http://www.lrolex.com/">Rolex</A>,
    <A href="http://www.newstylerolex.com/">Omega</A>,I belive that you will like them !046
    Nov. 11
    No namewrote:
    046Our website have many goods,<A href="http://www.newstylerolex.com/" title="Cheap Brand Name Watches">Rolex</A> -
    <A href="http://www.newstylerolex.com/" title="Replica Rolex">Replica Rolex</A> -
    <A href="http://www.newstylerolex.com/" title="Brand Name Watches">Replica Watches</A> -
    <A href="http://www.newstylerolex.com/" title="Brand Name Watches">Rolex Watches</A> -
    <A href="http://www.sunglassvip.net" title="Welcome to our Replica Watches website">Replica rolex</A> -
    <A href="http://www.sunglassvip.net" title="high quality timepieces">Rolex</A> -
    <A href="http://www.2g-3g.com" title="high quality timepieces">Rolex</A>
    <A href="http://www.watches-life.com" title="cheap price">Rolex</A>
    <A href="http://www.watches-life.com" title="cheap price">Replica Rolex</A>
    <A href="http://www.rolex-hot.com" title="cheaper price">Rolex</A>
    <A href="http://www.rolex-hot.com" title="cheaper price">Replica Rolex</A>
    <A href="http://www.vertuexclusiveshop.com" title="cheaper vertu">Vertu</A>
    <A href="http://www.vertuexclusiveshop.com" title="cheaper Replica vertu">Vertu Replica</A>,
    <A href="http://www.e-lv.net" title="Replica handbags">Replica handbags</A>,
    <A href="http://www.enjoy-watches.com/" title="high quality watches">Rolex</A>,
    <A href="http://www.enjoy-watches.com/" title="Brand Name Watches">Replica Watches</A>,
    <A href="http://www.iphonebatteries.org/" title="Batteries,Phone Batteries">Phone Batteries</A>,
    <A href="http://www.lrolex.com/">Rolex</A>,
    <A href="http://www.newstylerolex.com/">Omega</A>,I belive that you will like them !046
    Nov. 6
    wow goldwrote:
    Aug. 4
    No namewrote:
    Oct. 6
    No namewrote:
    Sept. 14
    No namewrote:
    Sept. 11
    No namewrote:
    Sept. 11
    light freeworldwrote:
    （突破一网一絡一封一鎖一软-件）下載：
    https://sites.google.com/site/freegatebbs
    （可上浏览維-基-百-科、Facebook、BBC、youtube等）
    （穿一透一网一络一防一火一墙）（免费代-理-服-務-器）
      [全一球一互一联一网一自一由一联一盟]
    July 22
    No namewrote:
    保持上动态网的方法。谷歌网上订阅：访问网页https://www.google.com/reader/view/feed/http://qxbbs.org/qxdailynews.xml，点击任何一个当日公布的SSL加密代理就可进入动态网。点击连接后请接受安全证书来加密浏览。使用IE 7点击连接时，可能会出现"此网站的安全证书有问题"警告，这是正常的，点"继续浏览此网站"就能安全登陆动态网。
    June 29
    簬子 Cwrote:
    3Q啦！！~~ 
    Aug. 20
    Shirleywrote:
    谢谢，太棒了！ 
    July 26
    碧华 沈wrote:
    不解
    July 15
    Iris♥艾丽丝wrote:
    不懂
     
    June 9
    Du vivianwrote:
    你太有才了，哈哈
    Apr. 21
    心海浪花wrote:
    试啦,很好用
    Apr. 9
    小德 上官wrote:
    谢啦!!呵呵,对这个还要向你多学习丫!!
    Mar. 12
    路子wrote:
    我想在自己的背景上用文本滚动框....高手教教这只菜鸟吧~~
    先谢啦！！
    Feb. 12
    YI 糖wrote:
    呵呵 谢谢 学会了拉一点 不过很开心了...
    Feb. 8
    Next >    Last >>