|
原创：不知
转自：❀美丽驿站❀
整理：寂语
滚动文本框很实用，也很简单，代码如下：
<DIV align=center
style='
background-color: transprant;
border: solid 2px black;
width: 355px;
height: 200px;
overflow: auto;
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>
返回普通编辑模式，你会发现并没有出现滚动条，不要着急，看看下面的部分代码解释第5条……
部分代码解释：
-
align=center 表示框内内容居中对齐，缺省情况下为左对齐，即，如果框内文字需要左对齐，那就可以把align=center删掉……
-
background-color: transprant; 表示框内背景色为透明，需要改颜色的话，把transprant改成16进制颜色值即可，例如#ffffff……
-
border: solid 2px black表示文本框的边线状态，solid表示实线，可选的值有dashed(虚线)，double(双线)，outset等等，和前面的类似， 2px black分别表示边线粗细和颜色，可自行调整(black和#000000效果一样)……
-
width: 355px; height: 200px; 分别表示滚动文本框的宽和高，自行调整，我的日志宽度是355px……
-
overflow: auto; 这句比较关键，auto表示"自动"，即框内内容不需要占据height: 200px这么高的高度时，就不会出现滚动条，一旦超过了，滚动条就会出现，多出的部分通过下拉滚动条来显示，overflow也设置的值还有scroll，即强制出现滚动条，但我不推荐用该值，因为这样也会强制出现横向的滚动条，很难看，用auto就可以了……
-
后面那部分代码，就是设置滚动条的颜色状态，根据自己的需要和喜好来调整，比较有用的是scrollbar-face-color: #889B9F;这句，其他部分不改也问题不大，看你的要求了……
将代码调整好后，返回普通编辑模式，双击滚动文本框，就可以进入框内编辑文字或图片，再次进入代码模式，会发现文本框代码有所变动，不过变化不太大，可以看懂……
示例：
<DIV align=center
style='
background-color: transprant;
border: solid 2px black;
width: 355px;
height: 200px;
overflow: auto;
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>
接下来说说文字竖排是如何实现的。除了制造特殊效果，我在Space空间展示的文字竖排没有什么真正的实用性，只会给阅读者造成麻烦，不过本着尽可能挖掘Space潜力的原则，我还是尝试了如下的语法：
<DIV style="FONT-SIZE: 9pt; WRITING-MODE: tb-rl; TEXT-ALIGN: left"><p>日志文字</P></DIV>
这个语法中唯一的亮点就是Writing-Mode这个参数，其后的tb代表文字排列从上到下，rl代表从右到左。
下面就给大家介绍三种彩色文字光影效果的相关语法：
阴影：<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即可。其他方面的参数没有太多需要强调的，这里之所以采用华文彩云字体同时加粗，是为了达到更好的效果，你完全可以按照自己的喜好加以调整。需要说明的是，这几种效果只适用于标题或少量文字上，否则后造成阅读上的困难。
感谢loadmemory的分享！ | 
ツール 
