网易部落html编辑文本进阶技巧…zt

Welcome to 抹杀's Home

抹杀：45608782

网易部落html编辑文本进阶技巧…zt

类别：私人生活查看:... 评论:...

发表于：2006-05-23

见证部落的发展壮大…甚是欣慰…网易部落更象个大染缸…里面的土著好象更侧重于部落推出的圈子活动，却忽略了个人主页，也就您自己的blog，其实部落的个人主页还是不错的，就是缺少点个人建设blog的挑战性，少了点自定义模板，适当的开放几个blog自由链接的模块，能起到锦上添花的作用…好了不多说了…来部落那么多日子，却未曾为部落做点事情，很是惭愧，也从未来过新手上路版面，今天来此地和大家分享一下kimi所知道的一些常用的html代码，在部落喜欢发表缤纷多彩甚至花哨日志的朋友可以一阅 …先声名一下：kimi对IT并不在行，只是出于爱好摆弄这些东东，东拼西凑瞎摆弄…有时偶尔悟出点门道而沾沾自喜之，还请真正的高手莫见笑…下面这些内容不会侧重于技术上的分析，定义为“实用”的小把戏，很适合懒得在技术上走心思的朋友…分几个章节…以后会陆续添加之……

kimi欢迎大家……

相信不少板油已经发现，网易部落对HTML语言具有相当强大的支持能力…虽然处理日志时，个人主页只提供给我们简单的几个文字处理功能…但如果你在写日志时选择html编辑文本，那么您的日志将大不同…通过对文本一定的代码处理，编辑完毕后选择“设计”预览一下，你会惊奇的发现原来我们的日志可以如此的绚烂多彩…可以根据个人的喜好任意编辑文本…能让浏览您日志的网友更好的体会您写日志的心情…提供一个让人轻松漂亮的阅读环境是对他人的尊重哈…下面我们就言归正题吧……

kimi欢迎大家……

先张贴一下编辑文本必备的颜色代码：

1 白色 #FFFFFF 2 红色 #FF0000 3 绿色 #00FF00 4 蓝色 #0000FF

5 牡丹红 #FF00FF 6 青色 #00FFFF 7 黄色 #FFFF00 8 黑色 #000000

9 海蓝 #70DB93 10 巧克力色 #5C3317 11 蓝紫色 #9F5F9F 12 黄铜色 #B5A642

13 亮金色 #D9D919 14 棕色 #A67D3D 15 青铜色 #8C7853 16 2号青铜色 #A67D3D

17 士官服蓝色#5F9F9F 18 冷铜色 #D98719 19 铜色 #B87333 20 珊瑚红 #FF7F00

21 紫蓝色 #42426F 22 深棕 #5C4033 23 深绿 #2F4F2F 24 深铜绿色 #4A766E

25 深橄榄绿 #4F4F2F 26 深兰花色 #9932CD 27 深紫色 #871F78 28 深石板蓝 #6B238E

29 深铅灰色 #2F4F4F 30 深棕褐色 #97694F 32 深绿松石色 #7093DB 33 暗木色 #855E42

34 淡灰色 #545454 35 土灰玫瑰红色#856363 36 长石色 #D19275 37 火砖色 #8E2323

38 森林绿 #238E23 39 金色 #CD7F32 40 鲜黄色 #DBDB70 41 灰色 #C0C0C0

42 铜绿色 #527F76 43 青黄色 #93DB70 44 猎人绿 #215E21 45 印度红 #4E2F2F

46 土黄色 #9F9F5F 47 浅蓝色 #C0D9D9 48 浅灰色 #A8A8A8 49 浅钢蓝色 #8F8FBD

59 浅木色 #E9C2A6 60 石灰绿色 #32CD32 61 桔黄色 #E47833 62 褐红色 #8E236B

63 中海蓝色 #32CD99 64 中蓝色 #3232CD 65 中森林绿 #6B8E23 66 中鲜黄色 #EAEAAE

67 中兰花色 #9370DB 68 中海绿色 #426F42 69 中石板蓝色#7F00FF 70 中春绿色 #7FFF00

71 中绿松石色 #70DBDB 72 中紫红色 #DB7093 73 中木色 #A68064 74 深藏青色 #2F2F4F

75 海军蓝 #23238E 76 霓虹篮 #4D4DFF 77 霓虹粉红 #FF6EC7 78 新深藏青色#00009C

79 新棕褐色 #EBC79E 80 暗金黄色 #CFB53B 81 橙色 #FF7F00 82 橙红色 #FF2400

83 淡紫色 #DB70DB 84 浅绿色 #8FBC8F 85 粉红色 #BC8F8F 86 李子色 #EAADEA

87 石英色 #D9D9F3 88 艳蓝色 #5959AB 89 鲑鱼色 #6F4242 90 猩红色 #BC1717

91 海绿色 #238E68 92 半甜巧克力色#6B4226 93 赭色 #8E6B23 94 银色 #E6E8FA

95 天蓝 #3299CC 96 石板蓝 #007FFF 97 艳粉红色 #FF1CAE 98 春绿色 #00FF7F

99 钢蓝色 #236B8E 100亮天蓝色 #38B0DE 101棕褐色 #DB9370 102紫红色 #D8BFD8

103石板蓝色 #ADEAEA 104浓深棕色 #5C4033 105淡浅灰色 #CDCDCD 106紫罗兰色 #4F2F4F

107紫罗兰红色 #CC3299 108麦黄色 #D8D8BF 109黄绿色 #99CC32

如果想自定义配色请☞进入： 自动配色

再添加一些可爱的图标，凭个人喜好可以添加进日志的文本或者标题…

ⓛⓞⓥⓔ ╬ 『』∴ ☀ ｡◕‿◕｡ ♫ ♬ ♩ ♭ ♪ ☆ ∷ ﹌の ★ ◎ ▶☺ ☻ ► ◄ ▧ ▨ ♨ ◐ ◑ ↔ ↕ ↘ ☼ ▀ ▄ █ ▌░ ▒ ▬ ♦ ◊ ◦ ♠ ♣ ▣ ▤ ▥ ▦ ▩ ◘ ◙ ◈ ☆♂♀ ♥ ♡ ☜ ☞ ☎ ☏ ⊙ ✎ ˉˇ¨〃々「」『』〖〗【】±＋－×÷∧∨∑∏∪∩∈√⊥∥∠⌒⊙∫∮≡≌≈∽∝≠≮≯≤≥∞ ℃ ＄ ¤ ￠￡‰§№☆ ★ 〇 ○●◎◇◆ 回 □ ■△▽⊿▲▼◣◤◢◥▁ ▂ ▃ ▄ ▅ ▆ ▇ █ ▉ ™

←→↘↙〓┣┓┏┫×╰ノ◢◣◥◤ΩжфюЮ━╃╄━卍┛┗【】¤∞㊝≡✖™乀♈◖◗♋Café灬⺌⺗≈◈Шǎˇиζ￡℡❣·•●∈⊹⊱⋛⋋⋌⋚⊰⊹彡◕‿◕✌✍✡✓✔✕べòべあ〠〄╬ⓛⓞⓥⓔ╬『』ღ㊀㊁㊂㊃㊄㊅﹌⺻;⺻*.:｡✿*ﾟ’ﾟ･✿✐❉✪εo✗✘✚✪✣✤
☆︷☜❤☞♥♡☎☏☺☻♨☼♭♪の￡❤♂♀♠♣•♪♬♧→∴∷〓×〖ஐ✲❈✿✲➹◕‿-｡☀oO＃ψ▓►◄√╮╭╯╰ァ┱┲★♫♭♪▶△▲γō凸∩∪╦╩⊙◎▀▁▂▃▄▅▆▇█┋︻︼¤▽ㄒ︶︿ε＞＜┘┌∵︹︺₪☃☄☇☈☉☊✥✦✧✩✫✬✭✚✪✣✤✥✦❉❦❧❃❂❁❀✄
☋☌☍☑☒☢☸☹☺☻☼☽☾♠♢♣♤♦♧♨♩✙✈✉✌✁✎✐❀✰❁❤❥❦❧➳➽〠〄㍿♝♞➳➴➵㊚㊛℗♯♩♮☎☪❉❊❋❖⓪①②③④⑤⑥▧▨♨◐◑↔↕▫☼♦░▒▬♦◊◦☼♠♣▣▤▥▦▩◘◙➸❝❞☁Þ✱௫μo(‧'''‧)oべòべあぃ╋ω㊣§■ΘIし↑↓✱✲✳❃❂❁

kimi欢迎大家……

发表日志前请进入自己的个人主页点击“发表文章”进行…如下图：
kimi欢迎大家

好咯…我们可以随心的编辑我们的文本了哈…

kimi欢迎大家……

第一章缤纷色彩背景

部落其实提供非我们一个“背景色”按钮…但为了使我们的日志文本更具冲击力，我们还是有个代码来实现的…让日志随我们的心情而变换不同的色彩吧……

在上面的语句<P>和</P>之间试着打几个字，然后点击“设计”按钮，可以看到日志的背景颜色已经改变。当你想更改不同色彩的时候，只需将#990000这个颜色编码的数值加以调整就行了…可以参考上面的色卡，也可以进入上面的自动配色

在HTML编辑状态你会发现，处理起文字来可是有些困难，当然对高手来说，区区几个语句就能解决问题，但我们普通大众可没这本事和耐心。怎么办？很好办！重新起用“设计”按钮，即取消HTML语法编辑状态就可以了。这时你会发现，我们重新进入了文本编辑模式，但这里已不是一片空白，而是多了一个色彩背景，在色彩背景内对文字的编辑就是轻车熟路了……一个色彩还不够丰富，我想要五颜六色的生活!没问题…重新回到HTML语法编辑状态，在你想使用其他色彩的文字前再加入上面HTML语句，然后调整色彩值。这里还需注意两点：一是仍然注意要把文字部分嵌套在上述语句中，二是为达到最佳效果必须调整提供不同色彩的HTML语句中的高度比值，至于什么值比较合适，就得根据文字内容的长短了，你可以边调整…边预览之……

kimi欢迎大家……

第二章立体彩色边框
拥有了缤纷色彩背景的日志显得生动活泼了许多哈…那现在我们让日志更加活泼一点…编辑文本日志时我们也可以采用立体彩色边框代码，因其涉及到的CSS边框属性语法是以后制作立体效果边框的基础形式…记住下面这段语法哦…
<div STYLE="border-style:solid;border-width:5pt; border-color:red">输入文本</div>

它会在你的日志文字外生成一个红色边框，border-width控制边框的粗细，border-color调整边框的颜色…而border-style则控制边框的效果，当使用“solid”则为单一颜色的线形简单边框…如果自己想调整颜色…就按照上面的方法做…我就不重复了哈……

接下来我们再将上述语法扩展一下，就可以获得具有立体效果的彩色边框。那么从何下手呢？其实就是在border-style后面使用不同的语法描述:

Solid 简单线形边框 Double 简单双线边框 Groove 沟线立体效果边框 Ridge 脊线立体效果边框 Inset 嵌入线立体效果边框 Outset 浮出线立体效果边框

通过定制边框的方法再将上一教程添加色彩的语法嵌套其中，你就可以创造出具有立体效果的彩色日志背景。

例如：

使用上述语法将会为你呈现一个黄底色红边框的浮出线效果背景，其实上述语法还有其他形式的简化写法，这里不再赘述…只采用上述较直接易理解形式……

对于背景边框的四个边你也可以按自己的需要进行调整，以左边框为例，你可以使用下述语法：

Border-left-style:solid (double, groove, ridge, inset, outset)定制边框样式
Border-left-color: #xxxxxx定制边框颜色
Border-left-width: xpt 定制边框粗细

其他三个边框只要分别使用Right, Top, Bottom就可以了。将下面的语法放到你的日志中预览一下，看一看是什么效果：

展示效果：

乙酉(鸡)年五月十六公历6月22日lomo图片

浮出立体线框效果图

你可以按照自己的想法随意调整四个边框的式样，以便创造与众不同的效果，记住一点，不同的属性描述之间用 ; 隔开。值得注意的是你可能会注意到，当你设置完边框返回到日志文本“设计”编辑模式，在键入文字过程中如果使用回车键，就会又出现一个边框，从而影响文字的连贯性，很不美观…别怕哈…这是因为HTML语法中不支持硬回车…解决很简单，返回到HTML编辑模式，在需要回车的地方键入<br>，需要几次回车就键入几个<br>，也可以键入<p>，一个<p>等于两个<br>…然后再返回到文本“设计”模式，你就会发现边框背景内已经是您想要的效果了哈……

第三章添加背景音乐

其实背景音乐的添加还是很简单的…有多种语法能够实现…我就不多介绍了…记住下面这个语句，由于载入音频文件需要时间，再您第一次打开日志后需要一定时间的加载…所以请大家最好选择较小的wma格式…放弃mp3格式…

<P><IMG height=0 loop=infinite dynsrc=音频文件地址 width=0 border=0></P>

这段语法唯一需要你更改的就是Loop，它控制着循环播放的次数，当为infinite时是无限循环，为0时是不循环，其他循环次数只需键入相应数字即可…你想播放几次就几次哈…是不是很简单呀…要注意的是音频的地址一般都是容易更改的（除非您有自己的存放空间），如果有一天您听不到音乐了，可能是你选择的wma已经更改，很简单呀，那就重新找一首您喜爱的歌曲…替换一下面的地址即可…咔咔……

kimi欢迎大家……

第四章添加视频流媒体

也很简单呀…和第三章一样很简洁的语法，如下：

IMG后的Height和Width分别控制视频画面的高度和宽度，你可以根据需要自行调整，如果这里你都设置成0的话，那么就只有音乐看不到图像，这也等同于插入背景音乐的效果。Loop控制循环次数…

对于页面中视频位置的控制，可通过加入下述语法实现视频与文字的完美结合。如下：

align=left 文字置于视频的右边，并与其紧密结合
align=right文字置于视频的右边，并与其紧密结合
align=top 文字队齐视频顶端
align=middle 文字队齐视频中部
align=bottom 文字队齐视频底端

这里关键是流媒体文件的获取，正常的流媒体文件以asf，wmv，或mov等为后缀，这是最直接的形式；也有以asx为后缀的，这种文件格式隐藏了流媒体的真正地址，但没有关系，你一样可以将带有asx后缀的链接放到你的语法中。目前网上多数流媒体文件都隐藏了其链接，很难通过直接的方法来查看，有关这方面的破解技巧网上多有提供，大家可以试试……

kimi欢迎大家……

第五章添加计数器和QQ在线交流指示器以及MSN在线交流指示器…

计数器和QQ在线交流指示器是两个比较叫实用的工具…前者你可以了解自己的blog 受欢迎程度…后者又为来访者提供了你目前IM的在线信息，方便与您及时联系。很遗憾popo未能支持在线交流工具…希望popo部门及时跟进……

先说计数器吧…提供这种服务的网站很多…在搜索引擎中键入“Free Web Counter”会查找到很多结果，向大家推荐http://www.amazingcounters.com/。这个网站提供350多种计数器，款式繁杂，花色多样，童叟无欺……绝对满足你的需要……申请时需要注册…过程很简单，一般只需要提供少量的个人信息即可。注册成功后你就可以选择心仪的计数器了，然后再输入你个人网站的信息，你将获得一段在线生成的HTML页面代码。某些网站还会提供给你简单的在线编辑功能，让你进一步对计数器的外观作简单的修改，以更好的适合你的需要。将获取的代码拷贝…然后转到你需要插入计数器的部落日志里面，还是按照html按钮输入那段代码…再选择“设计”预览…调整一下计数器的位置…发表日志就ok了…当然您也可以把计数器安装在您的个人介绍下面…象我的如图：

kimi欢迎大家

如果你想获得有关你的空间流量的具体信息，诸如单位时间内的访问量，来访者停留时间，来访者IP及所在国家等等众多专业统计结果，上述网站就不能满足你的需要了。推荐你到这个网站申请此项服务：http://www.statcounter.com/，它提供了极其强大且稳定可靠的统计功能，几乎面面俱到（至少对于我们这个水平是足够了），而且众多信息均以图形或表格的方式予以呈现，直观明了（Tucow五星推荐）。所有这些服务均为免费，除非你的月访问量超过20万。唯一的缺点就是提供的计数器样式过于简单，可供选择的余地也不大。。它的申请过程很简单，成功后会先让你选择计数器样式（你可以进行简单的定值），然后设定某些参数，诸如通过Cookie功能将你自己的登陆排除在统计数字之外等，之后你可以在Install Code页面获取HTML代码，需要注意的是，它会为不同类型的页面生成不同的代码，因此你要在“Statcounter Code Option”里选择“Html Only Code”，通过这个命令生成的代码才可用于网易部落，获取代码后的操作就和上面已降解的方式一样了。由于是海外的服务商，所以页面信息全部是英文，这对于不谙E文的朋友可能有些麻烦…

MSN在线交流指示器，到下面这个网站http://snind.gotdns.com:8080/ 在“Messenger”下拉菜单里选择MSN，当然如果你有Yahoo，或AOL等提供的及时通讯工具，也可以为其申请相应的指示器。输入你的MSN Messenger用户名，网站很快会为你生成一段代码，这段代码显示的是一个图标，通过其颜色的变化来显示你的Messenger的不同状态，直接将此代码按上述方法添加到日志中就可以了。有两个问题需要注意：该状态指示不会实时更新，它显示的状态是访问者登陆你的空间时你的在线状态，如果你在此期间上线或离线，指示器不会实时同步做出反应，除非刷新页面才会看出变化。另外显示的状态和真实状态可能会有稍许延迟，但不严重。还有一种情况也可能会发生，就是服务商的Server关机，那么指示器就无法正确显示任何状态了…

QQ在线交流指示器也很简单，代码如下：

替换一下当中的QQ号码即可……展示如下：

点击上面图标可以直接进入给我留言，不管我在不在线…当你的QQ登陆状态时上面的图标为亮色…反之则为暗色…也需要注意：该状态指示不会实时更新，它显示的状态是访问者登陆你的空间时你的在线状态，如果你在此期间上线或离线，指示器不会实时同步做出反应，除非刷新页面才会看出变化…显示的状态和真实状态可能会有稍许延迟，但不严重……

kimi欢迎大家……

第六章文字效果及卷轴滚动文本框以及文字竖排

光晕效果代码很多，我也不多介绍了，随便搜索一下就一大把…下面这些是kimi常用的代码…

color=#ff6600为颜色代码，可以自行修改。

☞例：：color=#FF00FF的效果如下：灯笼海棠红

……欢迎光临kimiblog……

☞例：color=#FF0000的效果如下：纯红

……欢迎光临kimiblog……

8：阴影、发光、模糊的代码：

阴影： <FONT style="FONT-SIZE: 20pt; FILTER: glow(color=black); WIDTH: 100%; FONT-FAMILY: 华文彩云"><B><STRONG><FONT face="Arial Black, Geneva, Arial, Sans-serif" color=#ff0000 size=5>阴影字体常用……</FONT></STRONG></B></FONT>

kimi阴影字体常用…… 发光： <FONT style="COLOR: #xxxxxx; FILTER: glow(color=black); FONT-FAMILY: 华文彩云; FONT-SIZE: 20pt; WIDTH: 100%"><B>输入文本</B></FONT>

……欢迎光临kimiblog……

模糊： <FONT color=#xxxxxx style="FILTER: blur(add=1, direction=40,strength=10); FONT-SIZE: 30px; FONT-WEIGHT: bolder; WIDTH: 200px">输入文本</FONT>

卷轴滚动文本框，有时候我们的日志文本内容太多，为了不占用太多空间，就可以采用卷轴滚动文本框，告诉大家两种格式，当然您可以根据自己的喜好调整卷轴滚动文本框的颜色大小等等哈……

常用卷轴：

自定卷轴：

<DIV align=center
style='
color: #6B238E;
background-color: #FFFFFF;
border: solid 2px black;
width: 472px;
height: 300px;
overflow: scroll;
scrollbar-face-color: #6B238E;
scrollbar-shadow-color: #32CD32;
scrollbar-highlight-color: #70DBDB;
scrollbar-3dlight-color: #EAADEA;
scrollbar-darkshadow-color: #85989C;
scrollbar-track-color: #95A6AA;
scrollbar-arrow-color: #38B0DE;
'>输入文本</DIV>

文字竖排可以起到意想不到的效果…代码如下：

1.利用css中的layout-flow:vertical-ideographic

效果如下：

马上谁家白面郎
临阶下马蹋人床
不通姓字粗豪甚
指点银瓶素酒尝.

代码

<DIV style="WIDTH: 109px; LAYOUT-FLOW: vertical-ideographic"><FONT face="Geneva, Arial, Sans-serif, Simsun">马上谁家白面郎<BR>临阶下马蹋人床<BR>不通姓字粗豪甚<BR>指点银瓶素酒尝.</FONT></DIV>

2, 利用writing-mode实现文字竖排

先看效果

马上谁家白面郎
临阶下马蹋人床
不通姓字粗豪甚
指点银瓶素酒尝.

代码:

<DIV style="WIDTH: 116px; WRITING-MODE: tb-rl">
<P><FONT face="Geneva, Arial, Sans-serif, Simsun">马上谁家白面郎<BR>临阶下马蹋人床<BR>不通姓字粗豪甚<BR>指点银瓶素酒尝.</FONT></P></DIV>

背景日志…470*350…文本…400，让您的日志有张漂亮的脸蛋哈…代码如下…

(opacity=100, finishOpacity=10,style=3); WIDTH: 472px; HEIGHT: 330px"
决定背景图片的大小……
<DIV style="FLOAT: left; WIDTH: 472px; HEIGHT: 300px"
决定文本文字的范围……
finishOpacity=10
决定背景图片边框的深浅
style=3
决定背景图片的颜色的深浅

红色为替换背景图片地址…

http://img144.echo.cx/img144/3981/longxia3mq.jpg 龙虾

http://img144.echo.cx/img144/8919/candou3ct.jpg 蚕豆

==========================================

文本字与字之间距离控制…代码如下：

<div style="letter-spacing:0.2em;line-height:8pt">输入文本</div>

Letter-spacing控制字母间的间距，对于中文就是字与字之间的间距，如果想实现英文单词之间间距的变化则使用word-spacing：；line-height控制行间距，无论编辑英文还是中文均使用此命令……

==============================================

文字和图片位置设置：

<IMG height=131 src="http://img144.echo.cx/img144/8919/candou3ct.jpg" width=93 align="right">
关键就在于align="right" :图靠右 align="left" :图靠左

<IMG height=131 src="http://img144.echo.cx/img144/8919/candou3ct.jpg" width=93 align="right"><P><FONT color=#660066><FONT size=2>左文本右图片</P></FONT>

<IMG height=131 src="http://img144.echo.cx/img144/3981/longxia3mq.jpg" width=93 align="left"><P><FONT color=#660066><FONT size=2>左图片右文本</P></FONT>

如果上面图片需要弹出超链请用下面语法替代：

其中border=2代表为超链图片有无边框，0为无边框…数字越大，边框越明显……

图片超链弹出替换格式替换如下：

<A href="http://bulo.163.com/-001F.html" target=_blank><IMG height=100 alt="kimiblog" src="http://img144.echo.cx/img144/3981/longxia3mq.jpg" width=200 align=right border=2></A><P><FONT color=#660066><FONT size=2>左文本右图片</P></FONT>

===============================================

对文本当中的某一短语或者短句进行强调代码如下：

<font style="BACKGROUND-COLOR:#FF1CAE" color="#FFFFFF">所要强调的文本</font>

注意：BACKGROUND-COLOR:#FF1CAE"底色 color="#FFFFFF"文本颜色

=======================================================

回复版也就是象日记本一样的背景…大家可以试试哈，代码如下…

<P><DIV align=center><DIV style="WIDTH:375px; HEIGHT:300px"><DIV style="FILTER: Dropshadow(color=#CC3299,offX=10,offY=10); WIDTH: 100%; FONT-FAMILY: Verdana; HEIGHT: 100%" align=center><DIV style="BORDER-RIGHT:#8F8FBD 3px dotted; BORDER-TOP:#CC3299 3px dotted; FONT-SIZE: 9pt; BORDER-LEFT:#7F00FF 3px dotted; WIDTH: 375px; LINE-HEIGHT: 11pt; BORDER-BOTTOM:#70DBDB 3px dotted; FONT-FAMILY: Verdana; HEIGHT: 170px; BACKGROUND-COLOR:#D9D9F3" align=center><FONT face=华文彩云 color=#333333>回复版输入文本</FONT></DIV></DIV></DIV></DIV></P>

兰色为阴影色码……

====================================

1：单线框
<DIV id=html002p style="BORDER-RIGHT: #808080 2px dotted; BORDER-TOP: #808080 2px dotted; DISPLAY: block; BORDER-LEFT: #808080 2px dotted; BORDER-BOTTOM: #808080 2px dotted"><FONT face=Verdana color=#808080>输入文本</DIV>

2：上下双线框
<DIV id=html002p style="BORDER-RIGHT: #808080 2px dotted; BORDER-TOP: #808080 2px dotted; DISPLAY: block; BORDER-LEFT: #808080 2px dotted; BORDER-BOTTOM: #808080 2px dotted"><FONT face=Verdana color=#808080><P><DIV id=html002p style="BORDER-RIGHT: #808080 2px dotted; BORDER-TOP: #808080 2px dotted; DISPLAY: block; BORDER-LEFT: #808080 2px dotted; BORDER-BOTTOM: #808080 2px dotted"><FONT face=Verdana color=#808080>输入文本</DIV></P></DIV>

==============================================================

外虚线内嵌色加线文本提示框，对日志内容的某一段文字进行引用或者说强调…这个语法还是很常用的…代码如下：

1px：框线宽度－ 1 点
dashed：框线式样－虚线
#000000：框线式样－黑色
background-color:#FFFFE0：背景颜色－淡黄

效果：

这是一张清末拍摄的社会风情照片，是1908年8月1日从广东湛江寄往法国的明信片，照片实际拍摄时间应比1908年更早一些.kimi觉得很珍贵，就保存下来了哈……

====================================================

文字超链
<a href="http://www.163.com">网易</a>

图片超链
<a href="http://www.sohu.com"><img src="http://images.sohu.com/logo1.gif"></a>

<A href="地址"><IMG src="图片地址" border=数值代表边框深浅></A>

新窗口弹出超链

<a href="http://www.163.com" target="_blank">网易</a>

<A href="http://photo.163.com/" target=_blank><STRONG><FONT face="Lucida Handwriting, Cursive, Simsun" color=#ff0000 size=2>http://photo.163.com/</FONT></STRONG></A>

改变超链字体,颜色,大小

<a href="http://www.163.com"><font size="3" face="华文彩云" color="red">网易</font></a>

=============================================

v 首字符放大下沉

【演示】

首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。

【HTML代码】

<DIV style="BORDER: 1px solid; WIDTH: 377px;">
<P style="FONT-SIZE: 12px; LINE-HEIGHT:16px; padding-left:5px;">
<SPAN style="FONT-WEIGHT: bold; FONT-SIZE: 25px; FLOAT: left; COLOR: #f60; LINE-HEIGHT: 32px;">首</SPAN>字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。首字符放大下沉示例。
</P>
</DIV>

==============================================

v 左侧滚动条

【演示】

　　这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。

【HTML代码】

<DIV style="BORDER: 1px solid; OVERFLOW: auto; WIDTH: 377px; DIRECTION: rtl; HEIGHT: 100px">
<DIV style="line-height:16px;font-size:12px;DIRECTION: ltr;">
  <P>　　这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。</P>
  <P>　　这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。</P>
  <P>　　这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。这是一个左侧滚动条的例子。</P>
</DIV>
</DIV>

====================================================

<img src="http://img250.echo.cx/img250/4030/popo3ra.gif" alt="Image Hosted by ImageShack.us" />

我的日志文本分割图片：

常用分割图片：

<img src="http://img152.echo.cx/img152/1839/19ez1.gif" alt="Image Hosted by ImageShack.us" />

运动足球分割图片：

<img src="http://img153.echo.cx/img153/2772/zuqiufenge6ey.gif" alt="Image Hosted by ImageShack.us" />

绚丽草莓分割图片：

<img src="http://img153.echo.cx/img153/4494/caimeifenge3la.gif" alt="Image Hosted by ImageShack.us" />

可爱橘子分割图片：

<img src="http://img153.echo.cx/img153/1403/juzifenge3tj.gif" alt="Image Hosted by ImageShack.us" />

轻松音乐分割图片：

<img src="http://img153.echo.cx/img153/6807/yinyuefenge5ji.gif" alt="Image Hosted by ImageShack.us" />

几张不错的搭配片片：

Image Hosted by ImageShack.us

<img src="http://img286.echo.cx/img286/2817/aixin5iu.gif" alt="Image Hosted by ImageShack.us" />

<img src="http://img286.echo.cx/img286/9689/liuxing7hl.gif" alt="Image Hosted by ImageShack.us" />

<img src="http://img286.echo.cx/img286/3447/lvye4si.gif" alt="Image Hosted by ImageShack.us" />

<img src="http://img286.echo.cx/img286/8946/mohuan9am.gif" alt="Image Hosted by ImageShack.us" />

<img src="http://img286.echo.cx/img286/5057/qiqiu4au.gif" alt="Image Hosted by ImageShack.us" />

<img src="http://img286.echo.cx/img286/8776/shenqi4nh.gif" alt="Image Hosted by ImageShack.us" />

好了，今天就先介绍上面的六个章节…时间有限…以后再继续添加…喜欢此类编辑日志的朋友随便看，大胆试哈……

网友评论想随时随地看作品抢沙发？

同时投上一票

| 申请您的主页 | 问题报告 | 意见反馈 | 帮助