0 条评论 | 2 views
我从事网页设计行业，已经有两年光景了，浏览器对CSS的识别是让我最头疼的，我曾经彷徨了好一阵，然后不断的收集资料，不断地研究，终于有一点儿小小的经验适用到我的工作中去了。可能这点儿经验不算什么，但是我想还是有帮助的，特别是对于刚接触CSS不久，然后仍然徘徊的初学者们，希望对你们有所帮助和借鉴。
好啦，闲话少说，咱们言归正传.....come on,let's go!!
1、DIV起初布局和CSS的大方向规划
* {margin:0; padding:0;word-break:break-all;}
body {background:#eeeeee url(../images/QZZT_head_bg.jpg) top center no-repeat;padding:0; margin:0; color:#333333; font-family:"宋体"; }
a {color:#333333;text-decoration:none; }
a:hover {color:#ba2636;text-decoration:underline; }
ul, li, span, img{ padding:0; margin:0; list-style:none; }
img{border:none;}
.F12 { font-size:12px; }
.F12 { color:#333333; }
.red { color:#CC0000; }
a.red { color:#CC0000; text-decoration:none; }
a.red:hover { color:#CC0000; text-decoration: underline; }
/*-------边框--------------*/
.border3 { border:1px solid #e6e6e6; }
.border2 {border-left:1px solid #d78327;border-right:1px solid #d78327;border-bottom:1px solid #d78327;}
.border1 {border-left:1px solid #d8d8d8;border-right:1px solid #d8d8d8;border-bottom:1px solid #d8d8d8;}
/*通用样式*/
.divline { height:10px; line-height:10px; width:auto; overflow:hidden; clear:both; }/*分割空间 折行*/
.clearboth { width:auto; height:1px; margin-top:-1px; overflow:hidden; clear:both; }/*清除浮动实现自动折行 无高度*/
0 条评论 | 1 views
［1］新建图层，命名为“太阳”。选择形状工具，按住shift同时拖动鼠标，画出一个正圆形，并填充金黄色；设置图层样式：外发光（相关参数酌情调整）
［2］在之上新建图层，右键图层菜单选择“创建剪贴蒙版”；用边缘虚化的画笔（柔角65、100等）绘制高光部分，颜色选用柠黄色和白色
［3］选择形状工具中的圆角矩形，酌情设置圆角参数，然后绘制细长的矩形（太阳周围的光芒）。之后依次进行复制，旋转180度，旋转90度、旋转45度等操作，达到一定的密度。如下图： ［4］Ctrl+单击之前的“太阳”图层得到选区，然后创建图层蒙板，光芒的末端同样用图层蒙版做渐隐处理。双击光芒图层，设置渐变叠加效果为径向渐变，颜色从白过渡到橙黄色。至此太阳部分绘制完毕 ［5］接下去绘制白云。用椭圆形状工具拉出一个圆形，如图设置图层样式： ［6］将此样式保存起来。另建图层，同样用圆形工具拉出一个个圆形，然后应用样式。如图所示： ［7］这种方法替代了用“涂抹工具”和“加亮变暗工具”来绘制白云，操作起来比较容易上手。接下来所要做的就是把这些零碎的“白云图层”合并为一个图层，然后略微应用高斯模糊和水平方向的动感模糊。最后使用图层蒙版，用黑色柔角画笔略微“擦去”白云下方的一些部分，让其变的透明缥缈一些。这些都完成后，复制一份白云放置在“太阳”下方，图标就完成啦。
0 条评论 | 3 views
