推荐阅读
利用PHOTOSHOP滤镜打造迷幻光束
这篇教程教飞特网的PS FANS们利用PHOTOSHOP滤镜打造迷幻光束；本教程前半部分的制作很多教程都有提到过，作者再在之前的基础上继续深化，加入了其它滤镜效果，从而使效果图更加美观。希望这篇教程对大家有用！最终效果下面是具体的制作步骤：1、新建一个400 * 400像素文件，选择渐变工具，颜色设置为黑白渐变，然后由上至下拉出下图所示线性渐变。 2、执行：滤镜 > 扭曲 > 波浪，参数设置如下图。 3、执行：滤镜 > 扭曲 > 极坐标，选择平面坐标到极坐标，如下图。
HTML语言剖析(三) 文件标记
欲明白本篇【HTML剖析】之标记分类请看 【标记一览】。 亦请先明白围堵标记与空标记的分别请看 【HTML概念】。 ■ HTML 基本架构： 以下 HTML Source Code 便是一份 HTML 文件的基本架构： 特点解说： 整份文件处于标记<HTML>与</HTML>之间。 <HTML>用以声明这是 HTML 文件，让浏览器认出并正确处理此 HTML 文件。 文件分两部分，由<HEAD>至</HEAD>称为开头，<BODY>至</BODY>称本文。 基本上两者各有适用的标记，如<TITLE>只可出现于开头部分。 开头部分用以存载重要资讯，而只有本文部分会被显示。 所以大部分标记会运用于本文部分。 <TITLE>所标示的是文件的标题。 会出现于浏览器顶部及为别人 Bookmark 时的名称，所以每页有不同而明确的标题 是需要的。 上述标记中只有<BODY>具参数设定。
Flash音频软件Sound Forge（四）
第四节 静音处理 一段音效，你想让它其中某一段什么声音都没有。本章就是教你如果做这个效果。 1,选择菜单栏里[文件]里[打开]WAV目录下的tov-4文件(这是我给你准备的素材文件),然后仔细观察这个WAV的波形的形状2,拖动鼠标选择需要静音的区域,然后选择菜单栏中[处理]中的[静音]3,现在你看到前面选择的区域的WAV文件的波形没有了,这说明这部分已经无任何声音了.4,静音处理结合下一节教的淡入淡出才能发挥她的魅力
最新发布
CSS实现完美垂直居中
之前看到很多人一直都问这个问题，不过当时我没当一回事，因为在 CSS 中要垂直居中，多数是在有高度的情况下，或者容器高度不定的情况下才用，看上去比较舒服，而且实现的方法也不少，不一定要拘泥于和 table 布局一样。不过最近有人问了几个例子，看来对此的需求还不少。现在就把我经验拿出来分享一下，希望大家鼓鼓掌。首先，要有一个概念：凡是 table 布局可以实现的，CSS 一定可以实现。CSS 可以实现的，table 未必能做到。现在来几个例子：一、单行内容的居中只考虑单行是最简单的，无论是否给容器固定高度，只要给容器设置 line-height 和 height，并使两值相等，再加上 over-flow: hidden 就可以了优点：1. 同时支持块级和内联极元素2. 支持所有浏览器缺点：1. 只能显示一行2. IE中不支持<img>等的居中要注意的是：1. 使用相对高度定义你的 height 和 line-height2. 不想毁了你的布局的话，overflow: hidden 一定要为什么？请比较以下两个例子：上一个高度是用的绝对单位px，并且没有隐藏溢出，下一个高度用的单位是相对单位em，并且隐藏了溢出。如果你的浏览器支持放大字体，那么尽情地放大字体，看看会出现什么效果。二、多行内容居中，且容器高度可变也很简单，给出一致的 padding-bottom 和 padding-top 就行优点：1. 同时支持块级和内联极元素2. 支持非文本内容3. 支持所有浏览器缺点：容器不能固定高度三、把容器当作表格单元CSS 提供一系列diplay属性值，包括 display: table, display: table-row, display: table-cell 等，能把元素当作表格单元来显示。这是再加上 vertical-align: middle, 就和表格中的 valign="center" 一样了。可惜IE不支持这些属性，不过在其他浏览器上显示效果非常完美。要注意的是：和一个合法的<td>元素必须在<table>里一样，display: table-cell 元素必须作为 display: table 的元素的子孙出现。
网页表单的Web标准解决方案
进入eYou.com后，马上就给新版的邮件界面转化成XHTML+CSS的工作，还好平时基本功还够扎实，有条不紊的干了下来。当然会遇到新的问题，比如，平时做网页，因为没有跟程序打过什么交道，较少使用表单。还好，世界还有Google，让我可以轻松应对新挑战。一些经验，写出来大家分享。 基于易用性（accesibility）的考虑，表单的标准写法应该在<form>和</form>之中包含fieldset和legend（说明），让用户明白该表单域的内容概要。简单的结构如下： 在某些场合或许你不愿意让也许fieldset和legend影响你的设计方案中的美观，好办，在CSS中把fieldset的border设置为0，legend的display设置为 none就行了。 在绝大多数情况下，表单的布局分两列，左边是标记（label），右边是输入框(input type="text"...)。如此简单的两列布局，我强烈建议不要使用表格。参考http: //stylephreak.frogrun.com/uploads/source/cssform.php和http: //www.aplus.co.yu/css/forms/?css=1（绝对有价值的两个参考，你已经可以不必往下看了），我们发现，Web标准通用的解决方法是，为label和input type="text"...的外围加上一个div，并把把该div的display设置为block。把label设为float: left;（这也是要把div设置为display: block;的原因）之后就可以让标记跟输入框同一行上了。让label 对齐的一个小窍门是，固定label的宽度，然后根据需要使用text-align向左或者向右对齐。设定宽度的小窍门是，使用单位em根据标记的最大字数来定宽度，不必辛苦测试px。 为了使我的阐述更容易理解，我简单写些代码： Chinaz~com XHTML：（部分） 中.国.站长站 <form> <fieldset> <legend>表单实例</lengend> <div><label for="name">姓名：</label><input type="text" id="name" /></div> <div><label for="etc">其他等等：</label><input type="text" id="etc" /></div> <div class="submit"><input type="submit" value="提交" /></div> </fieldset></form>CSS：（部分） Www.Chinaz.com
关于CSS实现自动换行的小技巧
css自动换行有什么技巧？大家都知道连续的英文或数字能是容器被撑大，不能根据容器的大小自动换行，下面是 CSS如何将他们换行的方法！ 大家都知道连续的英文或数字能是容器被撑大，不能根据容器的大小自动换行，下面是 CSS如何将他们换行的方法！ 对于div 1.（IE浏览器）white-space:normal; word-break:break-all;这里前者是遵循标准。 #wrap{white-space:normal; width:200px; }或者 #wrap{word-break:break-all;width:200px;} <div id="wrap">ddd111111111111111111111111111111</div> 效果：可以实现换行 2.（Firefox浏览器）white-space:normal; word-break:break-all;overflow:hidden;同样的FF下也没有很好的实现方法，只能隐藏或者加滚动条，当然不加滚动条效果更好！ #wrap{white-space:normal; width:200px; overflow:auto;}或者#wrap{word-break:break-all;width:200px; overflow:auto; } <div id="wrap">ddd1111111111111111111111111111111111111111</div> 效果：容器正常，内容隐藏 对于table
用DIV+CSS编写出的网页中的圆角矩形
用CSS+DIV编写的实现在网页中显示圆角矩形的代码！希望对大家有用！谢谢支持！ <style>div.bg{background:#ffc20e;width:50%}b{display:block;}/*将所有B标签转成块级元素*/ Www~Chinaz~comdiv b.topb b,div b.bottomb b{height:1px;overflow:hidden;background:#ffc20e;}/*div标签内类名为topb/bottomb的那个b标签的css属性值--高为1px，溢出部份隐藏,背景色同div.bg的背景色*/ div b.topb,div b.bottomb{ background-color:white}/*div标签内类名为topb/bottomb的背景色要与body背景色一致*/ b.t1{margin:0 5px}/*标签margin值将决定溢出的多少值被隐藏*/b.t2{margin:0 3px}b.t3{margin:0 2px}b.t4{margin:0 1px;height:2px;} </style> <div align="center"><div class="bg">
清除浮动的最优方法
在CSS森林群里讨论一个margin的问题中无意间发现overflow也可以用来清除浮动，嘿嘿，这个方法不单使用简单，而且FF、OP、IE7都支持，从此可以告别那又长兼容性又差的FF清浮动的方法了。方法真的很简单，只要为需要清浮动的标签加上overflow这个属性。CSS代码ul{list-style:none;height:auto;margin:0;padding:0;background-color:#436973;}li{float:left;width:80px;height:80px;background-color:#83B1DF;}.demo{clear:both;border:1px solid #FF00FF;margin-bottom:5px;}.overflow{overflow:auto;zoom:1;background-color:#43FF73;}ul{list-style:none;height:auto;margin:0;padding:0;background-color:#436973;}li{float:left;width:80px;height:80px;background-color:#83B1DF;}.demo{clear:both;border:1px solid #FF00FF;margin-bottom:5px;}.overflow{overflow:auto;zoom:1;background-color:#43FF73;}HTML代码<div class="demo"><ul class="overflow"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li><li>9</li></ul></div><div class="demo"><ul><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li><li>9</li></ul></div>其中zoom是为了IE6准备的。完整的Demo注：忘了一个很重要的内容，并不是所有的overflow属性都可起来一样的效果，比如visible属性就只能对IE起作用。例子可以看这里Demo2这样的话就有一个问题啦，如果要有高度，而且内容超出高度的时候，定义auto或hidden都可能会有一些不想要的效果出现。这里提供一个解决方案：对于IE6及以下版本的IE，可以直接定义高度；对于IE7、FF、OP，可定义min-height。CSS代码
实用的CSS常见的问题和技巧总结
1、善用css缩写可以减少页面文件大小，提高下载速度，同时使代码简洁可读。如： 再如： 可以改写为： 3、明确定义单位，除非值为0忘记定义尺寸是css初学者新手普遍存在的问题。在html我们可以写width=”100”，但在css中应该给出一个准确的单位。如：width:100px;height:50px;font-size:9pt ，0值除外，因为不论对于任何单位。0值的大小都是相等的。注意：不要在数值和单位之间加空格。
解决div在firefox下高度自动适应问题
属性: overflow:hidden <div id="Box" style="width:100%;background-color:green;overflow:hidden ;"> <div id="left" style="float:left;background-color:#333333;width:100px">左左左左左左左左左左左左左左左左左左左左左左</div> <div id="right" style="float:left; ">右右</div> </div>
总结新手学CSS容易出现错误的内容
一些新手容易忽略或者出现错漏的地方。1.首先是对于布局标签的定义。有时候写好了css，但是反复调试总发现效果差强人意，有那么一块空白，挥之不去。其实这就是对于标签定义的不严谨造成的。因为在xhtml的部分标签里，有一些的默认属性值不一定是为空或零的。例如form,p，他们的margin默认值并不是0，所以在定义时定要多加注意。我们可以这样写来更加严谨的定义：* { margin:0;padding:0 } /*注释:定义所有的标签的margin和padding为0*/2.缩写和大小写问题css对于class和id是区分大小写的，所以当样式不生效的时候建议先检查一下大小写问题。我建议所有名称统一小写，当然你有自己的编码风格也可以用。例如第二单词大写，oneTwo在css里有很多缩写的习惯，推荐使用缩写格式。基本的缩写有 属性缩写和颜色缩写等。属性缩写的例子：margin-top:1px;margin-left:1px;margin-right:1px;margin-bottom:1px;可以简单的写成 marign:1px;代表了以上四个属性。节约了很多字节。顺便提一下，margin的缩写比较特殊，给不会的朋友看看。margin x;代表四个方向都为xmargin x y;代表上下为x,左右为y;margin x y z a;x代表上,y代表右,z代表下,a代表左
css之自动换行
自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法对于div,p等块级元素 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行html<div id="wrap">正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义</div>css#wrap{white-space:normal; width:200px; }1.（IE浏览器）连续的英文字符和阿拉伯数字,使用word-wrap : break-word ;或者word-break:break-all;实现强制断行#wrap{word-break:break-all; width:200px;}或者#wrap{word-wrap:break-word; width:200px;}<div id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>效果：可以实现换行 2.（Firefox浏览器）连续的英文字符和阿拉伯数字的断行,Firefox的所有版本的没有解决这个问题,我们只有让超出边界的字符隐藏或者,给容器添加滚动条#wrap{word-break:break-all; width:200px; overflow:auto;}<div id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>效果：容器正常，内容隐藏 对于table 1. (IE浏览器)使用 table-layout:fixed;强制table的宽度,多余内容隐藏