优艾设计网

网站PhotoshopD模板切图为XHTML+CSS的网页实例

优艾设计网 https://www.uibq.com 2020-09-14 00:00 出处:网络 作者:不详
之前教了大家做网站PSD模板,那么,做好后怎样在实际中应用呢??怎样把这样做好了的模板切图为XHTML+CSS的网页呢??现在我们就来看一下设计好的模板切图的实例教程

 

接下来导出的是主体内容区,画出另一个大的选区,其重要包括整个中部面板——当然别忘记那些带有效果的地方比如阴影,半透明的边框等,都要一一包含在内。注意还要考虑到头部复杂的透明度的导航区域,所以选取应该直接延伸到顶部。

网站PhotoshopD模板切图为XHTML+CSS的网页实例

一般来讲允许网页垂直重复的话,只要选择中部区域一小列内容导出就可以,我们后面可以让他垂直重复来达到设计稿上面的效果而不增加文件体积。

网站PhotoshopD模板切图为XHTML+CSS的网页实例

下面来完成页脚部分,选择同样的宽度,然后高度要包含灰色渐变的图形。

网站PhotoshopD模板切图为XHTML+CSS的网页实例

为了导出侧边栏,主体区域现在暂时的使用垂直拉伸。

网站PhotoshopD模板切图为XHTML+CSS的网页实例

提示:键盘也能翻页,试试"← →"键
0

精彩评论

暂无评论...
验证码 换一张
取 消