推荐阅读

Maya教程:MAYA中磨损做旧效果的实现
先看看效果图感谢很多朋友对上一篇教程的热烈响应。本文写于2004年初,依然是一篇比较古老的教程。"做旧"一直是制作真实感3D效果不可缺少的因素。我们先看几张现实中的照片,并分析一下他们的特点:图(01)这是一张非常典型的具有磨损效果的铜制器具的照片。图(02)同样是一张表现具有磨损效果的石柱照片。图(C)这尊佛像同样是磨损效果的典型范例。

巧用Photoshop曲线和直方图让照片更干净
本教程主要使用photoshop用曲线和直方图工具让照片清新通透,这两个工具在调整图像的时候很实用的,今天就使用例子来解析一下,以这张图为例:老规矩,咱先看直方图:什么特征?典型的高光压缩直方图啊。再看一下各通道的直方图:

Photoshop简单制作马赛克海报背景图
示例:这个是我完成的最后效果:新建一个足够大的画布。设置一下前景色:以及背景色。小技巧:前景色和背景色很多情况下直接作用在滤镜中,也就是说。我前景色和背景色设置成什么颜色,那我滤镜后就显示这两种颜色。

蔬果瓜菜布光有讲究
这一次以蔬菜水果之类的农产品做为我们拍摄的主题,为了让画面更贴近生活,画面设计上决定采用拍摄食谱的手法,营造出创意厨房生活料理的味道。为了让拍摄画面更美轮美奂,前制的采买作业就显得很重要,为了找到品项较好的蔬果,特地在中午时刻就前往黄昏市场,这时段的市场尚在进货、准备,因此没什么客人,有助于我抢先挑选到外观模样较无瑕疵的蔬果(这也是我平时拍摄类似案子时所做的前制工作)。 过去我们在拍摄这类题材的时候,为了让照片看起来更干净一点,所使用的道具,无论是蔬菜、水果本身,还是钻板、厨具皆以新品为主,避免旧器物上的破旧污痕降低照片质量。比较让我惊讶的是,由于这次未与厂商合作,因此所有厨具皆来自自家厨房,不仅使用痕迹明显,造型更与设计构不着边,然而整体拍出来的照片,完全看不出一丝脏污老旧,藉由傻瓜摄影棚明亮、均匀光源,得以保留器物的使用痕迹与历史岁月,剃除了破败脏污的调性。 提早前往市场才能找到外观品项较佳的蔬菜水果,拍摄时画面才会更好看 另外一点,金属对象之所以特别难拍,在于其强烈的反射性质,容易将周遭环境倒映在金属表面上,导致拍出来的照片充斥着破碎凌乱的脏点(破碎的白色反光来自闪光灯,凌乱的黑点来自于周遭环境的倒映)。使用傻瓜摄影棚就算不是深谙打光技巧的商品摄影师,也能将金属对象拍出如广告般的平顺柔滑、渐层光泽。如本次照片中的刨具、滤网、模具……等,都是利用傻瓜摄影棚本身的光源拍摄出完美的金属光泽。 拍摄食材类的情境照片,难免加入金属厨具或餐具做为摆设点缀,由于金属在控光上不好处理,大多人不喜爱拍摄。利用傻瓜摄影棚的柔光特性,则可轻松的解决这恼人麻烦的问题,如本图的滤网与刨具,呈现出完美的渐层光泽,替照片加分许多。 傻瓜摄影棚的光源虽然仅来自顶部的两支灯管,但藉由摄影棚的设计,可让光线在摄影棚里进行充裕的反射,使光线均匀而柔和,以光学的角度来看,这样的光线最能突显被摄对象的色彩饱和度。而拍摄蔬菜水果这类题材最需要的就是色彩饱和度,才能表现出蔬果本身的新鲜度,卖相更受欢迎。值得一提的是,傻瓜摄影棚采用标准色温5500K灯管,只要将相机白平衡设定在日光白平衡模式,就能获得准确又饱和的蔬果照片。 拍摄时,玩家们一定会遇到正面光线不足,也就是蔬果前部过暗的情况,这时候建议在傻瓜摄影棚的前方装设弧形与直线反光板,也就是说明书上的B、C板,藉由两片反光板的反射,轻而易举就能解决前方光线不足的问题。 未使用反光板,蔬果前部偏暗,视觉上看起来就不怎么可口 使用反光板,蔬果前部获得足够的照明,整体照片的新鲜度大幅提升很多 利用弧形与直线反光板为产品前部补光示意图。图为拆掉C板(直线反光板)后,替蔬果泼水,提升蔬果新鲜度与饱和度的情境。
最新发布

网页HTML代码讲解:有序列表和无序列表
用于组织数据的列表学习了这么多控制网页显示的HTML标签,读者可以初步制作纯文章页面了。本节学习HTML中的列表元素,列表形式在网站设计中占有比较大的比重,显示信息非常整齐直观,便于用户理解。在后面的CSS样式学习中将大量使用到列表元素的高级作用。 4.4.1 列表的结构组成HTML的列表元素是一个由列表标签封闭的结构,包含的列表项由<li></li>组成。具体结构如图4.17所示。 4.4.2 制作无序列表顾名思义,无序列表就是列表结构中的列表项没有先后顺序的列表形式。大部分网页应用中的列表均采用无序列表,其列表标签采用<ul></ul>,编写方法如下:<ul> <li>列表项一</li>

网页HTML代码:滚动文字的制作
制作滚动文字 通过本章前面的学习,读者已经能够很好地控制各种段落文字的显示方式,不过无论怎么设置,文字都是静态的。本节笔者讲述HTML代码中比较特殊的标签,它能使网页中的文字滚动,并且可以控制其滚动的属性。 4.3.1 设置文字滚动HTML技术中使文字滚动的方法是使用双标签<marquee></marquee>。在HTML代码中可使其作用区文字滚动,默认为从右到左,循环滚动。在D:\web\目录下创建网页文件,命名为mar.htm,编写代码如代码4.15所示。 代码4.15 文字滚动的设置:mar.htm <html><head>

HTML网页各种字体格式的细节修饰
4.2 文字的多样化修饰上一节学习了大块段落的各种设置,对于文字本身修饰似乎更加吸引人。本节从文字的细节修饰入手,使读者能把握HTML的各种字体格式的变化,制作出更为专业的网页。 4.2.1 文字样式设置的基本标签—<font>设置字体样式的基本标签是<font></font>,被其包含的文本为样式作用区。在初学者的HTML代码编写中,<font></font>容易被多重嵌套,如<font 属性1=值1><font 属性2=值2>文本</font></font>。还有一种情况是标签嵌套错位,如<font><p>文本</font></p>。为了规范代码的编写,避免不必要的错误,读者在初学时一定要谨慎。 4.2.2 设置文字的颜色color是<font></font>标签的属性之一,用于设置文字颜色。在D:\web\目录下创建网页文件,命名为font_color.htm,编写代码如代码4.7所示。代码4.7 字体颜色的设置:font_color.htm<html><head>

HTML网页的段落排版和换行
HTML网页中的文字和段落通过上一章的学习,读者在网页整体表现设置方面有了比较扎实的基础。但是读者不仅是希望在网页上表现文字,更希望对网页上的文字进行排版、修饰。本章将学习文字的简单排版、修饰、滚动文字以及超级链接。超级链接在网站开发中无处不在,是网页中的重点。学习本章时,在D:\web\目录下创建一个目录命名为chapter3,把上一章的文件移动到D:\web\chapter3,做一个归类。本章继续在D:\web\目录下创建示例文件,这样方便用IIS测试示例文件。— 说明:以后章节都作类似处理,不再重复说明。如第4章文件归类到D:\web\ chapter4。4.1 段落排版和换行网页的外观是否美观,很大程度上取决于其排版。在页面中出现大段的文字,通常采用分段进行规划,对换行也有极其严格的划分。本节从段落的细节设置入手,使读者学习后能利用标签自如地处理大段的文字。 4.1.1 给大段文字进行分段简单地对文字分段常用<p></p>标签,即段落的开始用<p>,段落的结束用</p>标签。某些网页分段时省略了</p>,即作为单标签使用,因为下一段开始的<p>标签就意味上一段的结束。— 注意:笔者不推荐把<p>当作单标签使用,这样代码不规范,易出错。

网页中flash wmode属性你会用吗?
在flash标签中<param name=”wmode" value="xxxx">"Window" 在 Web 页上用影片自己的矩形窗口来播放应用程序,并且始终位于最顶层。"Opaque" 显示页面上位于它后面的内容。"Transparent"使 HTML 页的背景可以透过应用程序的所有透明部分显示出来,并且可能会降低动画性能。注:"Opaque"和"Transparent"都可与 HTML 层交互,从而允许 SWF 文件上方的层遮蔽应用程序。这两种选项之间的差异在于"Transparent"允许透明,因此,如果 SWF 文件的某一部分是透明的,则 SWF 文件下方的 HTML 层可以透过该部分显示出来,而"opaque"则不会显示。也就是如果发生FLASH遮盖DIV层的情况,就必须要改wmode属性为“Transparent”在做web开发中可能会遇到flash遮挡页面中元素的情况,无论怎么设置flash容器和层的深度(z-index)也无济于事,现有的解决方案是在插入flash的embed或object标签中加入”wmode”属性并设置为wmode=“transparent”或”opaque”,但wmode属性到底是什么意义,为什么可以解决这个问题呢?window mode(wmode)

XHTML教程:Transitional和Strict的区别
在推广Web标准的今天,那些崇尚Web标准的人经常说XHTML比HTML更加严格,当然从某种意义上说是的,比如它要求所有的标签关闭并且所有的属性都用引号。但其实XHTML 1.0还分两种(加上Frameset DOCTYPE的话算三种,本文不讨论),Transitional(过渡型)和Strict(严格)DOCTYPEs。并且HTML 4.01也有同样的文档声明。从字面上就可以看出来意思:Transitional DOCTYPEs只是为了实现从旧时代到新时代的过渡,而且Strict DOCTYPEs是默认的文档声明, 对构造HTML 4.01和XHTML 1.0都适用。使用Transitional DOCTYPE一般是由于代码中含有过多陈旧的写法,并且一下子很难完全转换到Strict DOCTYPE来。但是Strict DOCTYPE才应该是你的目标。它鼓励甚至有时是强迫你把结构与表现区分开来,把表现层的代码都写在CSS里。HTML 4 Document Type Definition:本HTML 4.01 Strict DTD不包括表现层属性和标签,W3C将逐渐淘汰这些属性和标签,您完全可以使用样式表来实现。您应该使用Strict DTD,如需获得表现层属性和标签的支持,请使用Transitional DTD。用Strict DOCTYPE还有一个好处,即可以让浏览器使用它们最严格、(一定程度上)最符合标准的模式来渲染页面。Tommy Olsson在Web Standards Group的Ten questions for Tommy Olsson一文中很好的阐述了使用Strict的好处:我觉得,使用Strict DTD,无论是HTML 4.01 Strict还是XHTML 1.0 Strict,远比讨论是用HTML还是XHTML重要的多。它代表了未来互联网的质量。它将结构和表现分开,使得维护一个站点非常容易。对于刚开始接触web standards和正确的、语义化的结构的人,认清Transitional和Strict DOCTYPEs的区别非常重要。更多详细列表请参考:XHTML: Differences between Strict & Transitional、Comparison of Strict and Transitional XHTML和XHTML1.0 Element Attributes by DTD。对于准备向Strict进发的人来说,两者的有些区别很可能会使开发者犯错误,接下来我将会谈到。元素类型的内容模型描述了什么样的元素类型实例可以被包含。这一点上,两种文档声明的最大区别在于blockquote, body, 和form元素仅能够包含块级元素,如:

网页设计之5种简单的XHTML网页表单
将输入框,选择框和文本框全部包含进 label 元素,并全部设置为块级元素。将单选按钮和多选框显示方式设置为 inline 以便于它们在同一行出现。如果你比较喜欢 label 和单选按钮/多选框出现在不同行,可以选择不把它包含在 label 里面,或者使用硬换行处理。每种情况都在下面展示了。当这些看起来比较时髦的时候,W3C 事实上已经含蓄地展示了他们的 label 例子。主要好处:简单代码:label, input, select, textarea {display: block;} label {margin-bottom: 10px;} input[type="radio"], input[type="checkbox"] {display: inline;} <form> <fieldset> <legend>Contact Form</legend> <label for="name"> Name</label> <input id="name" name="name" size="20" /> <label for="email">Email</label> <input id="email" name="email" size="20" /> <label for=" Choices"> Choices (radio) — <em>wrapped label</em></label> <input name=" Choice" type="radio" /> Choice 1 <input name=" Choice" type="radio" /> Choice 2 <input name=" Choice" type="radio" /> Choice 3 <label style="margin-bottom: 0pt;" for=" Choices2"> Choices (checkbox) — <em>non-wrapped label, margin reset</em></label> <input name=" Choice2" type="checkbox" /> Choice 1 <input name=" Choice2" type="checkbox" /> Choice 2 <input name=" Choice2" type="checkbox" /> Choice 3 <div style="height: 10px;"><!-- just to split the demo up --></div> <label for=" Choices3"> Choices (checkbox) — <em>wrapped, hard line-break</em></label> <input name=" Choice3" type="checkbox" /> Choice 1 <input name=" Choice3" type="checkbox" /> Choice 2 <input name=" Choice3" type="checkbox" /> Choice 3 <label for="dropdown"> Question</label> <select id="dropdown"> <optgroup label="Group of Options"></optgroup> <option>Option 1</option> <option>Option 2</option> <option>Option 3</option> </select> <label for="message"> Message <textarea cols="36" rows="12" name="message"></textarea> </label> <input type="submit" value="send it" /> </fieldset> </form> 运行结果:

译文:如何写出漂亮的HTML代码
老外写的一篇文章:What Beautiful HTML Code Looks Like 如何写出漂亮的HTML代码 感觉写的非常的不错,转载过来,与大家分享一下:ps:原文地址:http://css-tricks.com/what-beautiful-html-code-looks-like/1.DOCTYPE Properly Declared别忘记头部的声明,它会告诉浏览器如何渲染你的HTML。2.Tidy Head Section设置title,字符集.将CSS和JS外链(包括一个打印用的CSS)。3.Body IDed给body一个ID。这里作者提到的原因是,为多页面的中容器选择提供便利。比如通过给page1和page2中BODY设置不同的ID,就可以通过#page1 h2和#page2 h2来设置两种不同的效果,我感觉这个到是要看情况和具体架构再具体使用。4.Semantically Clean Menu编写符合语意的菜单代码。<div id="menu"><ul><li><a href="index.php">Home</a></li><li><a href="about.php">About</a></li><li><a href="contact.php">Contact</a></li></ul></div>ps:我个人觉得这样写代码应该更简单一点吧:<ul id="menu"><li><a href="index.php">Home</a></li><li><a href="about.php">About</a></li><li><a href="contact.php">Contact</a></li></ul>5.Main DIV for all Page Content要有一个主体DIV包含所有的内容。方便固定主体的宽度,边距等等。6.Important Content First先写主要内容,再写次要内容.如果你的导航或者侧边栏不是很重要,最好将他们写在最后。7.Common Content INCLUDED将导航,页尾等公用的部分用动态调用的方式引入,比如PHP的include。8.Code is Tabbed into Sections缩进代码

IE的有条件注释优点和缺点
IE的有条件注释是一种专有的(因此是非标准的)、对常规(X)HTML注释的Miscrosoft扩展。顾名思义,有条件注释使你能够根据条件(比如浏览器版本)显示代码块。尽管是非标准的,但是有条件注释对于其他所有浏览器作为常规注释出现,因此本质上是无害的。有条件注释在Windows上的IE5中首次出现,并且得到了Widnows浏览器所有后续版本的支持。IE的有条件注释及其有效,而且非常容易记住。主要的缺点是这些注释需要放在HTML页面中,而不是放在CSS中。这样,当你不需要这些东西,或者有所更改的时候,就需要维护很多的地方。让我们据几个例子来看看吧——只有IE才能识别因为只有IE5以上的版本才开始支持IE条件注释,所有“只有IE”才能识别的意思是“只有IE5版本以上”才能识别。只有特定版本才能识别例如,只有IE5才能识别,只有IE6才能识别,只有IE7或者IE8才能识别。识别的条件是特定的版本,高了或者低了都不可以。例如下面的代码块,将只会在IE8中有效<!--[if IE 8]><style type="text/css"> @import "test.css";</style><![endif]-->