推荐阅读
Photoshop鼠绘高挑性感的外国美女图片教程
提供最初的线稿，想学习的朋友最好跟着来一遍，那会比你看一遍领悟得更多：好多朋友喜欢用线稿作为绘画的第一步，不然，不知道怎么画。我不喜欢最后的作品有墨线的痕迹，不过这次我做一个适合大家口味的。 一、起型，就像x光一样，先不考虑其他的，我们把人体的结构画出来……二、描绘衣服，头发……，加一点阴影，对塑造体积有个概念……三、在背景层上面涂上颜色，用的是cs自带的水彩画笔，但是在画笔属性里面添加了画笔压力…… 大致描绘背景……
PS打造朦胧意境之美的梦幻感外景婚纱照
本教程主要运用了Photoshop中的模糊滤镜、图层混合模式、图层样式以及调色处理等，制作出外景婚纱照片的朦胧梦幻感觉，使画面有一种意境之美，效果很不错。在此基础上，大家在处理类似照片时还可以尝试刷上一些星光笔刷之类的点缀，也许会有更好的效果。原图效果教程开始打开图像Ctrl+j复制一层滤镜.模糊.高斯模糊
实例学用CorelDRAW9（十）
十、阴影的建立（海鸥） 不要生气，实例又用海鸥，没办法，我只是太懒了……我不是说过吗？我希望用很简单的实例告诉你C9怎么用，而不是让你学会做这样或那样的实例……我保证下次再不了……这一次，我们将要用到的工具是“交互式下落阴影工具”，呵呵，一听名字就知道很专业……现在，我可以开始实例了？谢谢…… ^_^打开海鸥，启动“互动式下落阴影工具”，这时就可以开始了（就是“互动式渐变工具”菜单里最后一个图标，有阴影的那个）。第二步：做出阴影。在画面上点击鼠标，随意拖动一定距离，松开就可以了。注意，阴影控制线上的白色滑块离黑色块越近，则阴影越深，反之则越浅，你可以试着调节一下。这一步的效果如图51所示。
拍出专业玻璃照片的前期拍摄与后期PS处理技巧
在本教程中我将告诉你如何在前期拍摄和数码后期处理，用最少的照片来拍出专业玻璃照片。您将学习专业照明用光技巧来表现一些惊人的照片和时尚的背景。 使用相同的背景和道具，但使用不同的相机设置。首先，我将介绍两种常见的照片拍摄技巧，然后我会告诉你如何捕获每张照片和后期采取Photoshop的处理步骤。 先欣赏一下最终效果图： 最终效果 第1步：设备的准备 在我们开始之前，你应该准备以下几点： 玻璃(您可以分解成小块)、锤、一个或两个胶袋、手链、两张黑色A4纸或黑色文件夹、台灯、鼎、相机、图形程序。 第2步：收集碎片 在我们开始采取实际的照片，你要把你已经准备好的玻璃打破。这就是为什么你需要一个锤子和塑料袋，因为你肯定不希望这些碎片四处散落。放入袋(或两个杯子，如果你想成为完全相信他们会留在室内)，然后用锤子打几次。(图1) 图1
最新发布
用CSS设计高用户体验的web文字大小
在设计网络应用时，您必须决定如何编辑字体。使用CSS时存在大量选项，每个开发者都有自己的喜好。本文主要讨论字体大小和网络应用内的操作。 字体大小 CSS2规范根据长度――水平和垂直尺寸――来定义字体。这个长度为一个数值，前面可能带一个可选的加(+)或减(-)标记符。另外，该数值后可能有一个可选的单位标识符。 另外，CSS2规范定义了两个单位类型:绝对单位和相对单位。绝对值指定单位，而相对单位指定一个与另一个值成比例的值。下面的列表列出了相对单位标识符: 下面是有效的绝对单位标识符: 测量绝对大小的另一种方法是使用衡量一个值的比例因数，应用以下关键字:最小、较小、小、中、大、较大和最小。中为基值，变小就减去一个因数，变大就增加一个因数，等等。CSS2规范定义的比例因数为1.2，这个值也可能依浏览器而变化。 还可以应用百分比值来格式化文本。百分比值是一个可选的标记符，即数字后带有一个百分比符号(%)。百分比值总是与另一个值成比例。就字体而言，它与网页的基本字体大小成一定比例。 如您所见，有许多方法可完成呈现文本这个看似简单的任务。下面的HTML格式文本(在段落元素中)应用了各种单位标识符。其中所有的值都相等，并假定以72dpi进行显示。 您可以在这个列表中增加像素值，但它的值要依环境而定。例如，我的分辨率为1280X1024的手提电脑将显示与在上表中使用50像素值一致的文本。
对css滑动门技术的一些总结和归纳
其中有个人说"如果你是高手,那你就详细介绍一下css滑动门技术",这句话把我刺激了,于是我连夜从网上搜罗了一些关于css滑动门技术的东西,并且自己做了一个滑动门,事实上在学习css滑动门技术之前,我发现我已经做过很多类似的菜单效果,最有代表性的就是搜狗网址导航的搜索框,后来这个效果被广泛运用到搜狗的搜索引擎当中,我在这里总结一下一些css滑动门的知识,希望能给大家对css的学习起到一个帮助作用,另外结合javascript,css可以制作出更多炫目的效果. 背景: 从我的理解来讲,css滑动门是被刺激出来的,因为很多人认为css并不能做出漂亮的网页,但是事实上恰恰相反,css不仅能做出相当漂亮的网页,还可以很好得把内容和表现分开,给设计师和开发人员更大的空间去发挥; 定义: 滑动门技术就是:当点击页面上的导航按钮后这个导航按钮的CSS特性发生变化，从而区别于该组的其他导航按钮，提示给操作者，当前浏览的内容就是这个CSS特性发生变化的按钮所指向的内容。这种效果的一大好处在于，在多导航的页面上能够清晰地反映当前浏览内容隶属于哪个栏目或者哪个类，同时给人以美观、清晰、明了的视觉感受。滑动门技术的主角是被操作的对象，也就是这里被点击的对象，其CSS特性主要是指该导航按钮包括其中的其它元素的属性发生变化，当然，这个按钮的形式可以是BUTTON、A、TD甚至可以是P或者DIV这样的闭合元素，它们的属性主要是指这个元素的边框、背景、字体的颜色、大小、粗细以及外间距和内间距等等，总之，其一切可以把自身的“地位”区别于其它属主的属性都可以被应用起来使用在滑动门技术上。 应用范围: 网站导航菜单 技术要点: 1.用无序列表ul和li组成菜单结构 2.给li设置背景(如果有圆角,则设置为右置或左置,背景图片远远超过该子菜单的长度)
网站重构 CSS样式表的优化与技巧
使用缩写可以帮助减少你CSS文件的大小，更加容易阅读。css缩写的主要规则请参看《常用css缩写语法总结》，这里就不展开描述。 二.明确定义单位，除非值为0 忘记定义尺寸的单位是CSS新手普遍的错误。在HTML中你可以只写width=100，但是在CSS中，你必须给一个准确的单位，比如:width:100px width:100em。只有两个例外情况可以不定义单位:行高和0值。除此以外，其他值都必须紧跟单位，注意，不要在数值和单位之间加空格。 三.区分大小写 当在XHTML中使用CSS，CSS里定义的元素名称是区分大小写的。为了避免这种错误，我建议所有的定义名称都采用小写。 class和id的值在HTML和XHTML中也是区分大小写的，如果你一定要大小写混合写，请仔细确认你在CSS的定义和XHTML里的标签是一致的。 四.取消class和id前的元素限定 当你写给一个元素定义class或者id，你可以省略前面的元素限定，因为ID在一个页面里是唯一的，clas s可以在页面中多次使用。你限定某个元素毫无意义。例如:
使用图片和CSS结合制作动画按钮
很多时候大家可以看到FLASH里面的按钮可以是动画的,而大部分HTML作出来的按钮都是单帧切换的.其实做成动画也是可行的.先看看下面的预览图片鼠标移动上去,鼠标点击,鼠标移开下面是实际效果，亲自体验一下 .temp1 a{display:block;height:31px;width:88px;background-image:url(http://www.syku.net/web/UploadFiles_5065/200612/20061209091641612.gif)} .temp1 a:hover{background-image:url(http://www.syku.net/web/UploadFiles_5065/200612/20061209091641694.gif)} .temp1 a:active{background-image:url(http://www.syku.net/web/UploadFiles_5065/200612/20061209091642451.gif)} .temp2 a{display:block;height:31px;width:88px;background-image:url(/design/UploadFiles_design/200806/2008062023300288.gif)} .temp2 a:hover{background-image:url(/design/UploadFiles_design/200806/2008062023300299.gif)} .temp2 a:active{background-image:url(/design/UploadFiles_design/200806/2008062023300241.gif)} a{display:block;height:31px;width:88px;background-image:url(图1)}a:hover{background-image:url(图2)}a:active{background-image:url(图3)}其实最重要的是在动画图片本身首先看看这个图片,似曾相识把.原理是一样的
导航上用CSS标志当前页效果的实现
当前页面--比如说现在的页面是首页，那么在导航栏上首页的色彩等和其他栏目有所不 同，用以给浏览者一个明显的指示。下面来说下具体的做法，菜单的基本实现和一般的CSS菜单没多大区别，着重说下如何 实现当前页。设菜单有5个栏目：home、about、products、services、contact，分别给每个栏目一 个ID，m1-m5，CSS可写成如下： #home #nav li#m1 a, #about #nav li#m2 a, #products #nav li#m3 a, #services #nav li#m4 a, #contact #nav li#m5 a{ color: #FFF; background: #DC4E1B url(navbg.gif) no-repeat; } xhtml：<ul id="nav"> <li id="m1"><a href="index.html">Home</a></li> <li id="m2"><a href="about.html">About</a></li> <li id="m3"><a href="products.html">Products</a></li> <li id="m4"><a href="services.html">Services</a></li> <li id="m5"><a href="contact.html">Contact</a></li> </ul> 然后分别给每个页面的bady标签一个独立的ID，例如给首页的ID是home，其余的类推 。 这样做法的好处是每个页面的菜单都是一样的，方便修改，动态页包含也容易。
通过Dreamweaver设计网页时组织CSS的建议
代码式（Inline）：写入到代码中的一次性的样式。 内嵌式（Embedded）：可控制一个页面中所有元素的样式表 外联式（External）：可控制许多页面中的元素的样式表 事实上，许多站点都根据需要把这三种方式结合起来使用。 在使用CSS时一个需要重点考虑的事实是不同的浏览器以及同一浏览器的不同版本以不同的方式来解析CSS。除了网络浏览器的差异之外，你还要意识到还有很多其他的浏览器，比如听力浏览器，基于电视的浏览器以及Palm pilot和TTY（teletypewriter，远程打字机）一类的手持设备。 最佳习惯是指什么？ 大多数技术都有自己约定俗成的标准。CSS也不例外。虽然并非网络上存在的所有CSS都很规范，但按照现有标准来使用CSS却还是不无裨益的。一般来说，开发人员应尽可能将内容与报告分离开来。这样做的好处在于： 1：增加站点的寿命 不规范的样式表可能在当时觉得很方便，但新版本的浏览器出来以后，很可能就会出现兼容性问题。到时逐页修改站点就是一项非常费时的工作同时也使使用CSS失去了意义。 2：让你的站点对所有的用户以及浏览器都适用。 有些地方的*已经立法要求网站必须让残障人士也同样可以浏览。为残障认识设计的浏览设备，比如听力浏览器，对CSS规范性要求极其严格。 3：让站点更新和维护更加轻松。
引入样式表(css)的四种方式
一、使用STYLE属性： 将STYLE属性直接加在个别的元件标签里。 <元件(标签) STYLE="性质(属性)1: 设定值1; 性质(属性)2: 设定值2; ...}例如： <TD STYLE="COLOR:BLUE; font-size:9pt; font-family:"标楷体"; line-height:150%>这种用法的优点 是可灵巧应用样式於各标签中，但是缺点则是没有整篇文件的『统一性』。二、使用STYLE标签： 将样式规则写在<STYLE>...</STYLE>标签之中。 <STYLE TYPE="text/css"><!--样式规则表--> </STYLE>例如： <STYLE TYPE="text/css"><!--BODY { color: BLUE; background: #FFFFCC; font-size: 9pt}TD, P { COLOR: GREEN; font-size: 9pt}--></STYLE>通常是将整个的 <STYLE>...</STYLE>结构写在网页的<HEAD> </HEAD>部份之中。这种用法的优点就是在於整篇文件的统一性，只要是有声明的的元件即会套用该样式规则。缺点就是在个别元件的灵活度不足。三、使用 LINK标签： 将样式规则写在.css的样式档案中，再以<LINK>标签引入。 假设我们把样式规则存成一个example.css的档案，我们只要在网页中加入<LINK REL=STYLESHEET TYPE="text/css" HREF="example.css">即可套用该样式档案中所制定好的样式了。 通常是将LINK标签写在网页的<head></head>部份之中。这种用法的优点就是在於可以把要套用相同样式规则的数篇文件都指定到同一个样式档案即可。缺点也是在个别文件或元件的灵活度不足。 四、使用@import引入： 跟LINK用法很像，但必 放在<STYLE>...</STYLE> 中。 <STYLE TYPE="text/css"><!-- @import url(引入的样式表的位址、路径与档名);--></STYLE> 例如： <STYLE TYPE="text/css"><!-- @import url(http://yourweb/ example.css);--></STYLE>要注意的是，行末的分号是绝对不可少的！
修饰之美：CSS在表格边框上的美学应用
具体内容包括：上边框宽度、右边框宽度、下边框宽度、左边框宽度、边框宽度、边框颜色、边框样式、上边框、下边框、左边框、右边框、边框、宽度、高度、有关标签等。 1.上边框宽度 语法: border-top-width: <值> 允许值: thin | medium | thick | <长度> 初始值: medium 适用于: 所有对象 向下兼容: 否 上边框宽度属性用于指定一个元素上边框的宽度。值可以是三个关键字其中的一个，都不受字体大小或长度的影响，可以用于实现成比例的宽度。不允许使用负值。也可以用在上边框、边框的宽度或边框的属性略写。 2.右边框宽度 语法: border-right-width: <值>
20 个优秀 CSS 网站
从这些 CSS Gallery 网站中精选了 20 个比较漂亮的 XHTML＋CSS 布局网站。推荐给喜欢网页设计的人，无论是做博客模板还是做网站设计，在设计理念、色调、导航条、按钮、排版布局方面，都有一些值得借鉴的地方。1、www.apple.comminmax_bound="true">刚刚改版的苹果官网，配合即将上市的 Leopard 风格。2、www.youtilize.comminmax_bound="true">这种布局和色彩搭配很适合我的口味。3、www.pingdom.comminmax_bound="true">一个测试网站连接和内容 (包括 HTML, CSS, JS 和图片) 加载时间的服务。4、www.workhabit.orgminmax_bound="true">5、www.web2themes.comminmax_bound="true">这是一个 WordPress 主题，特别之处就是加入一些人的剪影作为网页元素。6、www.zik.frminmax_bound="true">7、www.ashwebmedia.comminmax_bound="true">8、maczone.skminmax_bound="true">9、www.joshuadunaway.netminmax_bound="true">
CSS:标准的 语义的 非侵入的页签切换
自从Yahoo!的首页引进页签（tab, 见下图）之后，这种可用性极佳的方式越来越受欢迎，用户也逐步习惯和喜欢上它，因为它可以在原有的空间上增加更多的可用信息，而且只需切换，不需刷新整个页面，浏览更舒畅。很多网站接受并使用，如新浪等。 页签的标记结构 那么，让我们来看看这些页签后的代码。 新浪完全不考虑什么标准，就是表格嵌套，我们略过不提。Yahoo!的XHTML形式是这样的：<div> <ul> <li>页签1</li> <li>页签2</li> ... </ul> </div> <div> <div>内容1</div><!--它们可能由Ajax载入--> <div>内容1</div> ... </div> ... 符合标准，但却没有语义。页签和相应内容没有任何关联。也就是说，在没有CSS展现的情况下，用户并不晓得页签究竟对应哪一块内容。而且就JavaScript实现来说，必须对元素定义更多的id或者class作为调用钩子（hook），容易造成代码冗余。有人对此作出改良，使用连接元素的hash（即#号后的字段）跟内容进行关联，即下面这种形式：<div> <ul> <li><a href="#content1">页签1</a></li> <li><a href="#content2">页签2</a></li> ... </ul> </div> <div> <div id="content1">内容1</div><!--它们可能由Ajax载入--> <div id="content2">内容1</div> ... </div> ... 这种方式对于机器来说，确实找到了关联点，而且用户点击的时候，也能在hash的作用下（传统说法中的“锚点”）调到相应的内容区块。有进步，但还是不够语义。 语义，语义，语义！