推荐阅读
3DsMax制作“被束缚的花儿”实例教程
在这个教程中，我将告诉你们我是怎样制作这幅图片的，但我我不会按照细节一步一步地来说，我相信你们对3Ds Max都有基本的了解。这篇教程主要解释和描述有关建模、光照、纹理贴图和后期场景的制作等等，我一般都是按着这样的顺序来制作的，我觉得在现有的灯照下，这样做会使材料的设置更简单，因为我发现在材料编辑器中和在场景灯光下材料看起来的感觉是不一样的。可能这并不是最优方式，但是的确很适合我，我觉得你们也应该试着去找一种适合自己最好的方法，只有这样你才能提高你的工作效率。3DsMax制作“被束缚的花儿”作者：Nenad Tomic使用软件：3Ds Max不多说了，进入正题吧：场景中的几何体都是非常简单的。锁链：锁链只是用网格平滑建立的网格，制作中真的没有太多复杂的哲学概念。为了能把锁链放在我希望的位置中，我手动地将每一独立的链环进行位置设定，直到得到满意的结果。这样一来我可以轻松地创建一定的随机性以促成了一个感觉更真实的锁链，我也使用了路径变形插件，但我发现它不适合我当前的需要，因为它会让锁链弯曲，使它们产生曲线，这种曲线会导致一个不自然的效果。叶子和花瓣：
ps正片叠底图片就颜色变暗,如何恢复原色提亮
图片的混合，在ps设计中经常会被用到，正片叠底的使用更为频繁，那么正片叠底较为熟知的功能，就是自动去除白色背景，免去抠图的步骤，提高设计效率，不过也会有弊端，如果背景图偏暗，那么正片叠底的图片也会变暗，如何把图片的亮度提高或者还原，且看下面的图文教程。 1、ps软件打开背景图，以及一张白色背景的人像，人像图片需要使用正片叠底来完成背景的去除， 2、可以看到设置为正片叠底之后，人像的上半部分，处于背景图的亮部区域，相对而言，其原有亮度损失不大，但处与背景图暗部区域的下半端，明显变暗了，由此可见，想要把人像变暗的部分提亮，只需要把对应的背景区域提亮， 3、笔者使用的方法是，在背景图上面添加一个透明图层，切换至画笔工具，前景色设置为白色，更换柔边的笔刷，硬度为0，顶端的【不透明度】选项，可以酌情调整， 4、选中空白图层，画笔放在人像上进行绘制，注意不要超过人像边缘，可以看到人像提亮了， 5、对于想要提亮的区域，可以反复绘制，最后调整图层的【不透明度】，达到理想效果即可。 6、对比一下提亮前和提亮后，效果还是非常明显的，只需要控制好笔刷以及不透明度，就可以把正片叠底的图片提亮， 以上方法的原理也比较简单，正片叠底后的效果，与背景图的明暗有关系，添加一个图层绘制白色区域，也就相当于提亮了该部分的背景图，进而还原了图片的亮度。
在 Dreamweaver 中打开并编辑现有文档
您可以打开现有网页或基于文本的文档（不论是否是用 Dreamweaver 创建的），然后在“设计”视图或“代码”视图中对其进行编辑。 如果打开的文档是一个另存为 HTML 文档的 Microsoft Word 文件，则可以使用“清理 Word 生成的 HTML”命令来清除 Word 插入到 HTML 文件中的无关标记标签。若要清理不是由 Microsoft Word 生成的 HTML 或 XHTML，请使用“清理 HTML”命令。也可以打开非 HTML 文本文件，如 JavaScript 文件、XML 文件、CSS 样式表或用字处理程序或文本编辑器保存的文本文件。将在“文档”窗口中打开文档。默认情况下，在“代码”视图中打开 JavaScript、文本和 CSS 样式表。可以在 Dreamweaver 中工作时更新文档，然后保存文件中的更改。
利用Key对象来实现响应键盘的操作
利用按钮检测按键动作很有效，但是并不利于检测持续按下的键，所以不适合于制作某些通过键盘控制的游戏。这时，您就需要用到Key对象。Key对象包含在动作面板的“对象”/“影片”目录下面，它由Flash内置的一系列方法、常量和函数构成。使用Key对象可以检测某个键是否被按下，如要检测左方向键是否被按下，可以使用如下ActionScript：if (Key.isDown(Key.LEFT)) { trace("The left arrow is down");} 函数Key.isDown返回一个布尔值，当该数中的参数对应的键被按下时返回true，否则返回false。常量Key.LEFT代表键盘上的左方向键。当左方向键被按下时，该函数返回true。Key对象中的常量代表了键盘上相应的键，下面列出了一些基本的常量：一些功能键的表示：Key.BACKSPACE Key.ENTER Key.PGDN Key.CAPSLOCK Key.ESCAPE Key.RIGHT Key.CONTROL Key.HOME Key.SHIFT Key.DELETEKEY Key.INSERT Key.SPACE Key.DOWN Key.LEFT Key.TAB Key.END Key.PGUP Key.UP 以上是键盘上的功能键，那么如何表示键盘上的字母键呢？Key对象提供了一个函数Key.getCode来实现这一功能，如下所示：if (Key.isDown(Key.getCode("x"))) { trace("X is pressed");} 上面脚本的意思就是，利用Key.getCode函数来告诉系统你是否按下了x键，如果按下了x键以后，函数Key.isDown则会返回true,在输出窗口就会输出X is pressed。最后给出实例源文件：下载
最新发布
WEB2.0标准教程:第十天 自适应高度
如果我们想在3列布局的最后加一行页脚，放版权之类的信息。就遇到必须对齐3列底部的问题。在table布局中，我们用大表格嵌套小表格的方法，可以很方便对齐三列；而用div布局，三列独立分散，内容高低不同，就很难对齐。其实我们完全可以嵌套div，把三列放进一个DIV中，就做到了底部对齐。下面是实现例子(白色背景框模拟一个页面)： <style type="text/css"> #pagebox{ margin:0px; PADDING:20px; BACKGROUND: #FFF; FONT-FAMILY: arial,'宋体','新宋体',verdana,sans-serif; WIDTH:600px; } #header{ MARGIN: 0px; BORDER: 0px; BACKGROUND: #ccd2de; WIDTH: 580px; HEIGHT: 60px;} #mainbox { MARGIN: 0px; WIDTH: 580px; BACKGROUND: #FFF; } #menu{ FLOAT: right; MARGIN: 2px 0px 2px 0px; PADDING:0px 0px 0px 0px; WIDTH: 400px; BACKGROUND: #ccd2de; } #content{ FLOAT: right; MARGIN: 1px 0px 2px 0px; PADDING:0px; WIDTH: 400px; BACKGROUND: #E0EFDE;} #sidebar{ FLOAT: left; MARGIN: 2px 2px 0px 0px; PADDING: 0px; BACKGROUND: #F2F3F7; WIDTH: 170px; } #footer{ CLEAR: both; MARGIN: 0px 0px 0px 0px; PADDING: 5px 0px 5px 0px; BACKGROUND: #ccd2de; HEIGHT: 40px; WIDTH: 580px; } </style> <div id="pagebox">Body <div id="header">这里是#header{ MARGIN: 0px; BORDER: 0px; BACKGROUND: #ccd2de; WIDTH: 580px; HEIGHT: 60px;}</div> <div id="mainbox"> 这里是#mainbox { MARGIN: 0px; WIDTH: 580px; BACKGROUND: #FFF; }包含了#menu,#sidebar和#content <div id="menu">这里是#menu{ FLOAT: right; MARGIN: 2px 0px 2px 0px; PADDING:0px 0px 0px 0px; WIDTH: 400px; BACKGROUND: #ccd2de; }</div> <div id="sidebar"><p>这里是#sidebar{ FLOAT: left; MARGIN: 2px 2px 0px 0px; PADDING: 0px; BACKGROUND: #F2F3F7; WIDTH: 170px; }，背景颜色用的是#main的背景色</p></div> <div id="content"><p>这里是#content{ FLOAT: right; MARGIN: 1px 0px 2px 0px; PADDING:0px; WIDTH: 400px; BACKGROUND: #E0EFDE;}</p> <p>这里是主要内容，根据内容自动适应高度</p><p>这里是主要内容，根据内容自动适应高度</p> <p>这里是主要内容，根据内容自动适应高度</p> </div> </div> <div id="footer">这里是#footer{ CLEAR: both; MARGIN: 0px 0px 0px 0px; PADDING: 5px 0px 5px 0px; BACKGROUND: #ccd2de; HEIGHT: 40px; WIDTH: 580px; }。</div> </div> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行] 这个例子的页面主要代码如下：具体样式表都写在相应版块里了。重点在于#mainbox层嵌套了#menu,#sidebar和#content三个层。当#content的内容增加，#content的高度就会增高，同时#mainbox的高度也会撑开，#footer层就自动下移。这样就实现了高度的自适应。另外值得注意的是：#menu和#content都是浮动在页面右面"FLOAT: right;",#sidebar是浮动在#menu层的左面"FLOAT: left;"，这是浮动法定位，还可以采用绝对定位来实现这样的效果。这个方法存在另一个问题，就是侧列#sidebar的背景无法百分之百。一般的解决办法就是用body的背景色来填充满。(不能使用#mainbox的背景色，因为在Mozilla等浏览器中#mainbox的背景色失效。)好了，主要的框架已经搭建完毕,剩下的工作只是往里面添砖加瓦。
阻碍你学习CSS的因素 思维的转变 HTML结构化
我们通常采用DIV元素来将这些结构定义出来，类似这样： 以下是代码片段：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="//www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>www.suncss.com</title> <style type="text/css"> <!-- .code{ color:#666666; } table {border-collapse:collapse;} td,th {border:#000 solid 1px;} --> </style> </head> <body bgcolor="#FFFFFF"> <table border="0" cellspacing="0"> <tbody> <tr> <th>HTML属性 </th> <th>CSS方法 </th> <th>说明</th> </tr> <tr> <td class="code">align="left"<br /> align="right" </td> <td class="code">float: left; <br /> float: right;</td> <td><p>使用CSS可以浮动 <em>任何元素</em>:图片、段落、div、标题、表格、列表等等 </p> <p>当你使用float属性，必须给这个浮动元素定义一个宽度。 </p></td> </tr> <tr> <td><span class="code"><strong><font face="Verdana" color="#60a179">marginwidth="0" leftmargin="0" marginheight="0" topmargin="0"</font></strong></span></td> <td><span class="code"><strong><font face="Verdana" color="#60a179">margin: 0; </font></strong></span></td> <td><p>使用CSS, <span class="code"><strong><font face="Verdana" color="#60a179">margin</font></strong></span>可以设置在<em>任何</em>元素上, 不仅仅是body元素.更重要的，你可以分别指定元素的top, right, bottom和left的margin值。 </p> </P></td> </tr> <tr> <td><span class="code"><strong><font face="Verdana" color="#60a179">vlink="#333399" alink="#000000" link="#3333FF"</font></strong></span></td> <td><p><span class="code"><strong><font face="Verdana" color="#60a179">a:link #3ff;<br /> a:visited: #339;<br /> a:hover: #999;<br /> a:active: #00f; </font></strong></span> </p></td> <td><p>在HTML中，链接的颜色作为body的一个属性值定义。整个页面的链接风格都一样。使用CSS的选择器，页面不同部分的链接样式可以不一样。 <span class='Hbz109'></span> </p></td> </tr> <tr> <td><span class="code"><strong><font face="Verdana" color="#60a179">bgcolor="#FFFFFF"</font></strong></span></td> <td><span class="code"><strong><font face="Verdana" color="#60a179">background-color: #fff; </font></strong></span></td> <td><p>在CSS中，任何元素都可以定义背景颜色，不仅仅局限于body和table元素。 </p> </P></td> </tr> <tr> <td><span class="code"><strong><font face="Verdana" color="#60a179">bordercolor="#FFFFFF"</font></strong></span></td> <td><span class="code"><strong><font face="Verdana" color="#60a179">border-color: #fff;</font></strong></span></td> <td><p>任何元素都可以设置边框(boeder)，你可以分别定义top, right, bottom和left </p> </P></td> </tr> <tr> <td><span class="code"><strong><font face="Verdana" color="#60a179">border="3"<br /> cellspacing="3" </font></strong></span></td> <td><span class="code"><strong><font face="Verdana" color="#60a179">border-width: 3px; </font></strong></span></td> <td><p>用CSS，你可以定义table的边框为统一样式，也可以分别定义top, right, bottom and left边框的颜色、尺寸和样式。 </p> </P> <p>你可以使用 <span class="code"><strong><font face="Verdana" color="#60a179">table</font></strong></span>, <span class="code"><strong><font face="Verdana" color="#60a179">td</font></strong></span> or <span class="code"><strong><font face="Verdana" color="#60a179">th</font></strong></span> 这些选择器. </p> </P> <p>如果你需要设置无边框效果，可以使用CSS定义：<span class="code"><strong><font face="Verdana" color="#60a179"> border-collapse: collapse;</font></strong></span> </p> </P></td> </tr> <tr> <td><p><span class="code"><strong><font face="Verdana" color="#60a179"><br clear="left"><br /> <br clear="right"><br /> <br clear="all"> </font></strong></span> </p> </P></td> <td><p><span class="code"><strong><font face="Verdana" color="#60a179">clear: left;<br /> clear: right;<br /> clear: both; </font></strong></span> <span class='Hbz109'></span> </p></td> <td><p>许多2列或者3列布局都使用 <span class="code"><strong><font face="Verdana" color="#60a179">float</font></strong></span>属性来定位。如果你在浮动层中定义了背景颜色或者背景图片，你可以使用<span class="code"><strong><font face="Verdana" color="#60a179">clear</font></strong></span>属性. </p> </P></td> </tr> <tr> <td><span class="code"><strong><font face="Verdana" color="#60a179">cellpadding="3"<br /> vspace="3"<br /> hspace="3" </font></strong></span></td> <td><span class="code"><strong><font face="Verdana" color="#60a179">padding: 3px; </font></strong></span></td> <td><p></p></td> </tr> <tr> <td><span class="code"><strong><font face="Verdana" color="#60a179">align="center"</font></strong></span></td> <td><p><span class="code"><strong><font face="Verdana" color="#60a179">text-align: center;</font></strong></span> </p> </P> <p><span class="code"><strong><font face="Verdana" color="#60a179">margin-right: auto; margin-left: auto; </font></strong></span> </p> </P></td> <td><p><span class="code"><strong><font face="Verdana" color="#60a179">Text-align</font></strong></span> 只适用于文本. </p> </P> <p>象div，p这样的块级怨毒可以通过<span class="code"><strong><font face="Verdana" color="#60a179">margin-right: auto; </font></strong></span>和<span class="code"><strong><font face="Verdana" color="#60a179">margin-left: auto;</font></strong></span>来水平居中 <span class='Hbz109'></span> </p></td> </tr> </tbody> </table> </body> </html> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行] 一些令人遗憾的技巧和工作环境 由于浏览器对CSS支持的不完善，我们有时候不得不采取一些技巧(hacks)或建立一种环境(Workarounds)来让CSS实现传统方法同样的效果。例如块级元素有时侯需要使用水平居中的技巧，盒模型bug的技巧等等。所有这些技巧都在Molly Holzschlag的文章《Integrated Web Design: Strategies for Long-Term CSS Hack Management》中有详细说明。 另外一个关于CSS技巧的资源站点是Big John和Holly Bergevin的“Position is Everything”。 理解浮动行为 Eric Meyer的《Containing Floats》将帮助你掌握如何使用float属性布局。float元素有时候需要清除(clear)，阅读《How To Clear Floats Without Structural Markup》将非常有帮助。
Web标准化之form语义结构的实例
除了以上方法，我们还可以用label套嵌整个表单组件和文本标签，如： 4、使用optgroup标签 optgroup标签的作用是在选择列表中定义了一组选项。我们可以选用optgroup标签给select元素的options分类，并使用label属性，属性值会在下拉列表（select）里显示为一个不可选的、缩进标题。注意：optgroup 不支持嵌套。 IE6.0 中存在一个小Bug（FireFox 中不存在）：使用键盘方向键进行选择时，在 IE 中，当选中项由一个optgroup的选项换成另一optgroup 的选项时，不会触发onchange。解决办法是：增加 onkeydown 或 onkeyup 事件协助解决。5、使用button标签 定义与用法 定义为一个提交按钮。在button元素内你可以放置内容，像文本（text）或者图片（images）。这是这个元素和input元素按钮的区别。
关于使用CSS居中(包括水平/垂直)
用CSS如何使DIV层水平居中这两天开始对网志进行大刀阔斧的页面更改.今天碰到个很棘手的问题,DIV本身没有定义自己居中的属性,网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题.可是事实上这样的方法科学吗?经过网络搜索和亲自实验得出以下结论:正确的也是对页面构造没有影响的设置如下:对需要水平居中的DIV层添加以下属性:margin-left: auto;margin-right: auto; 经过这么一番设置问题似乎解决了,在FF中已经居中了,可是在IE中看竟然还是没有居中!郁闷了一下午,就是找不出问题所在,还特地比较了网上的文章竟然一模一样.问题到底出在哪里呢?感谢网友乐天无用帮忙找出了这个邪门问题的原因.原来是L-Blog默认没有在HTML前加上DTD,于是IE就以HTML而不是XHTML来解释文档.问题并不在CSS而在XHTML网页本身.需要加上这样的代码才能使得上述设置有效果: 说明：首先在父级元素定义TEXT-ALIGN: center;这个的意思就是在父级元素内的内容居中；对于IE这样设定就已经可以了。但在mozilla中不能居中。解决办法就是在子元素定义时候设定时再加上“MARGIN-RIGHT: auto;MARGIN-LEFT: auto; ”需要说明的是，如果你想用这个方法使整个页面要居中，建议不要套在一个DIV里，你可以依次拆出多个div，只要在每个拆出的div里定义MARGIN-RIGHT: auto;MARGIN-LEFT: auto; 就可以了。如何使图片在DIV 中垂直居中用背景的方法。举例：
同一个页面用多个id有什么影响
我们知道在样式表定义一个样式的时候，可以定义id也可以定义class，例如：id一个页面只可以使用一次，class可以多次引用。有网友问，id和class好象没什么区别，我在页面中用了多个id在IE中显示也正常，用多个id有什么影响吗？回答：第一影响就是不能通过W3的校验。在页面显示上，目前的浏览器还都允许你犯这个错误，用多个相同ID“一般情况下”也能正常显示。但是当你需要用JavaScript通过id来控制这个div，那就会出现错误。id是一个标签，用于区分不同的结构和内容，就象你的名字，如果一个屋子有2个人同名，就会出现混淆； class是一个样式，可以套在任何结构和内容上，就象一件衣服；概念上说就是不一样的：id是先找到结构/内容，再给它定义样式；class是先定义好一种样式，再套给多个结构/内容。web标准希望大家用严格的习惯来写代码，例如：你可以用<b></b>显示粗体，也可以用<strong></strong>来显示，但W3C 建议大家用<strong>，因为<strong>更有语义如果对这些细节问题不重视，觉得无所谓，那么你就没必要向xml过渡了，也没必要学习web标准了，因为web标准应用就是从这些小细节上的改变开始，否则用现在的html不是也可以？
巧用expression区分只读文本框和普通文本框的背景色
当然,我们可以改变只读文本框的背景颜色来加以区分,这个时候就需要程序员自己判断这个文本框是不是只读,然后再引入相应的css,无疑加大了工作量. 这里,使用expression来提供一种解决方案,只需要每个页面引入这个css即可,其它的都由程序自己判断,如下:<style> input{background-color:expression((this.readOnly && this.readOnly==true)?"#cccccc":"")} </style> <INPUT TYPE="text" NAME=""> <INPUT TYPE="text" NAME="" readonly> <INPUT TYPE="text" NAME=""> <INPUT TYPE="text" NAME="" readonly> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
你知道这些css网页设计技巧吗
1.CSS字体属性简写规则一般用CSS设定字体属性是这样做的：font-weight:bold;font-style:italic;font-varient:small-caps;font-size:1em;line-height:1.5em;font-family:verdana,sans-serif;但也可以把它们全部写到一行上去：font: bold italic small-caps 1em/1.5em verdana,sans-serif;真不错！只有一点要提醒的：这种简写方法只有在同时指定font-size和font-family属性时才起作用。而且，如果你没有设定font-weight, font-style, 以及 font-varient ，他们会使用缺省值，这点要记上。2. 同时使用两个类一般只能给一个元素设定一个类（Class），但这并不意味着不能用两个。事实上，你可以这样：<p class="text side">...</p>同时给P元素两个类，中间用空格格开，这样所有text和side两个类的属性都会加到P元素上来。如果它们两个类中的属性有冲突的话，后设置的起作用，即在CSS文件中放在后面的类的属性起作用。
用CSS层叠样式表完成可以控制的闪烁效果
上面这个示例就能实现上面所的效果，由于这里是抓取的一张图片，不能看到动态效果，只要按下面介绍的方法，制作一个试试，其效果是一目了然的。其制作思路是:采用了CSS的“Glow”滤镜产生光晕效果，利用CSS的属性可动态改变的特性，用一小段javascript程序来每一秒钟改变一次属性值，从而实现闪烁的效果，再用两个事件(onmouseover和onmouseout)调用Javascript程序来控制是否闪烁。 制作方法: 1、制作一个Glow滤镜，CSS滤镜的设置方法请参看“CSS滤镜应用技巧”的有关文章。在此不再重复。不是使用Dreamweaver的网友，请把下面的代码复制到网页源代码的〈head〉与〈/head〉之间: 〈style type="text/css"〉 〈!-- .glow1 { filter:glow(color=#FF0000,strengh=2)} --〉 〈/style〉 2、插入一个图层，取名为:bob。在图层上写上一段文字。再在图层上加载一个Glow滤镜，并加上两个事件以实现当鼠标移到文字上时强制停止闪烁，当鼠标移开文字时继续闪烁。代码:onclick="stopflash(this)"，这句代码的作用是:一旦鼠标移到文字上，将调用程序的“stopflash(this)”函数来停止闪烁; onmouseout="init()"，这句代码的作用是:一旦鼠标移开文字，将调用程序的“init()”函数来使光晕闪烁。本例完成后图层标记的代码是这样的: 〈div id="bob" style="position:absolute; width:572px; height:35px; z-index:1" class="glow1" onmouseover="stopflash(this)" onmouseout="init()"〉
用CSS代码轻松Diy你的网页滚动条
网页滚动条代码及其解释如下：（复制时请将大写尖括号改为小写） 以下是引用片段：＜Style type="text/CSS"＞ ＜!-- Body { scrollbar-face-color:#C0C0C0; （表面） scrollbar-highlight-color:#FFFFFF;（亮边） scrollbar-3dlight-color:#C0C0C0;（3D亮边） scrollbar-darkshadow-color:#000000; （3D暗边） scrollbar-Shadow-color:#808080;（阴影） scrollbar-arrow-color:#000000; （箭头） scrollbar-track-color:#E0E0E0;（滚动区） } --＞ ＜/Style＞ 以上的代码，从Body以下的，凡是#号后面的，都是颜色代码，颜色代码为16进制。而括号内的文字是对左边代码的注释，在加入网页代码时不要输入。这样一来，你就可以DIY自己的网页滚动条了。