推荐阅读
3DMAX实例教程：VRay打造精致乡村风格餐厅
如何体现一个充满加州柔和阳光的空间呢?这次以餐厅这个空间作为主题内容。从最初的平面设定到空间的布光和材质的赋给，成图的后期处理，我们在这里将一一进行体现。最终效果图图00空间概要及说明：这是一套300多平米的别墅，在整体的设计风格上，我采用了美式乡村风格，混搭了一些地中海的元素进去，这套方案没有传统美式的原始粗矿和古朴质感，却传承了一点地中海式的精致。在主题上摒弃了繁琐和奢华，以舒适为导向，以享受为原则，强调“回归自然”，给人一种心灵上的释然以及回归大自然的淳朴的思路，打造一个安宁平静、舒适自然的美妙净土。(图01)图01平面设定和分析：分析平面图，首先我考虑的是这部分空间分为两块，即餐厅和厨房。当然以餐厅为重点。在这里我把厨房做成敞开式厨房，为了让这两个空间的衔接更紧密，功能更齐全，于是又考虑增加了一个吧台，有情调且实用。我们都知道餐厅以用餐为主，那么所有的功能都要以满足这个需求来产生。在家具灯具以及材料的选择上，也是要以美式的感觉进行搭配。比如铜艺的灯具，厚重的家具，本色的棉麻以及有着浓郁自然清新味道的植物。(图02)
身影画中游
视频叠加相信很多喜欢多媒体的朋友都尝试过，今天我们换个玩法，让的照片在视频影片里产生奇妙的“画中游”景观。使用的工具是友立公司的PhotoImpact 7和VideoStudio 6，操作方法也很简单。 制作无背景照片 启动PhotoImpact 7，导入准备好的人像照片。 按下主窗口左侧工具栏上的选取工具，根据照片背景的复杂程度，选择使用“魔术棒”或“贝氏曲线工具”来去除照片背景（如图1）。制作“画中游”影片 启动 VideoStudio 6，新建项目后按下主窗口右侧的文件夹图标，将准备好的视频剪辑导入到素材库中。 打开主菜单“故事板”选项，在素材库里选中导入的影片，将其拖至视频编辑窗口的“视频轨”中（如图3）作为背景影片。可以导入几段视频剪辑与后面的人像图片配合。影片长度可在编辑窗口里激活后任意拖拉调整，以符合整个影片剪辑的需要。 打开主菜单“覆盖”选项，激活视频编辑窗口的“覆盖轨”，打开主窗口右上角的“素材类型”卷展栏，选择“图片”素材库，按下主窗口右侧的文件夹图标，将准备好的无背景人像图片导入到图片素材库中，把它拉至“覆盖轨”里，激活后依前法拖拉调整播放长度，使其与背景影片长度吻合。我们这个实例里使用了两段视频和两个无背景人像，其长度分别是对应的。 导入的人像照片需要进一步调整，才能达到我们预期的效果。激活“覆盖轨”里的人像照片后，按下主窗口左上角的“动画”设置钮，进行各项参数的设置（如图4）。 提示：“运动类型”与刚才设置的人像位置是有密切关系的，如果人像从右侧滑入，我们需将人像位置设置在屏幕左侧，反之亦然，设置时最好将人像的位置移出画面二分之一左右，产生滑出画面的效果。 设置完毕按下主窗口里的预览钮看一看，效果不错，为了锦上添花，再为这段影片加上活动的文字标题，使它更加生动。选中主菜单上的“标题”选项激活文字标题编辑线，在预览窗选取你满意的文字渲染方式后，将其拖至编辑窗里的“标题轨”，在左上角参数栏设置好文字字体、颜色、阴影和动画方式。最后拖拉“标题轨”中文字标题调整播放长度，使其与相配合的背景影片长度一致。 VideoStudio有添加音效的功能，朋友们可根据喜好自行设置添加，在此不再赘述。 影片的保存或导出 我们的作品一切OK了！在预览窗中看到随着背景影片的播放，人像慢慢地滑入画面，又慢慢地滑出，下一个人像紧接着滑入进来，画面上还相应出现了绚丽的动画标题文字，融合成为一段天衣无缝的新视频！下面就把我们的作品保存起来。 选中主窗口“完成”选项，在这里可将它存储为自定义的视频文件，或直接创建刻录成VCD、DVD、SVCD等格式的光盘。 保存完影片后，还可以按下[导出]按钮，将这段影片制作成一张颇有新意的电子贺卡，搭配好贺卡页面，调整好影片大小和位置，生成一个自执行的EXE文件，就可以把它发给朋友一起分享你的快乐了
用Flash 8 AS代码写摄像头拍照功能
因为很久不做 Flash coding 了，所以也就很少关心 Flash 8 的新的 Class，但听大家说过有这个功能。本想从网上找段教程或 code 来做。可是发现国内还没有类似的。就只能自己动手丰衣足食了。 开始做法： 第一步：在库中建立一个视频元件，类型选择：视频(受 ActionScript 控制)。 第二步：将视频元件拖到场景中，并调整尺寸到想要的大小。并起名为“my_video” 第三步：在时间轴中粘入下边的 code。 Testing 发现有问题，拍出来照片只有 160x120 的区域有图像。并且图像变形了。 :eek: 什么地方出了问题呢？@#$%^&* (此处省略2小时 debug 时间……) 最后发现 my_video 复制到场景中调整大小时并不是改变 my_video.width 及 my_video.height 属性，而是改变 my_video._width 及 my_video._height 属性。原有视频元件的尺寸只有 160x120 。这就相当于将 my_video 作了形变。而 BitmapData.draw() 是不会考虑源元件的形变的。用官方的说法是： QUOTE: 源 MovieClip 对象不对此调用使用其任何舞台中转换。该源 MovieClip 对象会被视为存在于库或文件中，没有矩阵转换、没有颜色转换，也没有混合模式。如果您希望通过使用影片剪辑自身的 transform 属性来绘制影片剪辑，则可以使用它的 Transform 对象来传递各种 transformation 属性。
摄影教程：走近你的被摄者
和模特出外约拍，作品却都僵硬死板如木头?拍出来没有情绪，没有感觉? 也许只是你与你的模特还不够接近…… 本文将展示一位摄影师的拍摄心得，与你分享走近被摄者内心的要领~。 再走近一点就好 Robert Capa 说过“如果你的照片没有拍得很棒，那代表你还可以走得更近去拍摄”(If your photographs aren’t good enough, you’re not close enough)。 如果套用在人像摄影上，所谓的“没有走得更近”当然不是在说你跟 Model 的拍摄距离，也并不是叫你每张照片都跑到 Model 面前去拍大头特写，或是用百微去拍摄眼睫毛才叫做有 feel。其实我个人认为照片没有拍好，那是因为很多时候拍摄者并没有“走近”被摄者的“真实性格”和“内心世界”。在作品上，如果只流于“浅”景深、可爱十式或纯粹摄影技巧表现的话，作品难免缺少了深层次的演译，主题亦会变得空洞。 这照片有爱 这个副标题，是有一次跟我的*好友藤原克也先生讨论一辑人像作品时，他评论了某摄影人的作品，说了一句话：那照片有爱。 藤原克也大哥是*拍摄人像的大师级人物，也是《摄影之道-氛围×构图×主题的光影演绎》一书的作者。当时我在向他请教如何去拍摄感性一点的主题，他就回了我一句：“拍这个主题，要有爱”。 原来*摄影人在发表人像作品时，如果拍得很好的话，其它摄影人都会开玩笑式的留言：“有爱”，意思即为揶揄拍摄这个作品的摄影人，一定在拍摄的过程中爱上了这个模特儿，不然不可能拍出如此扣人心弦的作品。虽然听上去有些无聊，但想深一层，如果没有和 Model 做好沟通和引导，没有全神贯注地去发掘被摄者的表情，的确是很难构成一辑佳作。
最新发布
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的宽度,多余内容隐藏