网页设计综合例案.pptVIP

下载本文档

5
0
约2.85千字
约 13页
2017-04-09 发布于北京
举报
版权申诉

网页设计综合例案.ppt

1、本文档共13页，可阅读全部内容。
2、原创力文档（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击这里二次下载。
4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。
5、该文档为VIP文档，如果想要下载，成为VIP会员后，下载免费。
6、成为VIP后，下载本文档将扣除1次下载权益。下载后，不支持退款、换文档。如有疑问请联系我们。
7、成为VIP后，您将拥有八大权益，权益包括：VIP文档下载权益、阅读免打扰、文档格式转换、高级专利检索、专属身份标志、高级客服、多端互通、版权登记。
8、VIP文档为合作方或网友上传，每下载1次，网站将根据用户上传文档的质量评分、类型等，对文档贡献者给予高额补贴、流量扶持。如果你也想贡献VIP文档。上传文档

摄影师个人网站布局 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 案例描述 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 网页设计步骤步骤工具内容分析结构设计原型设计效果图设计布局设计视觉设计交互设计铅笔纸橡皮 HTML Axure RP Visio Fireworks Word Fireworks Photoshop CSS HTML CSS HTML Fireworks Photoshop CSS JavaScript DreamWeaver Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 一、内容分析参考网站： / / 内容决定网页的形式 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 二、 HTML结构设计使用具有一定含义的标记，如h1p… 任何一个页面，应该尽可能保证在不使用CSS的情况下，依然保持良好的结构和可读性。这不仅仅对访问者有帮助，而且有助于被搜索引擎收录。当有若干个项目并列时，ul是较好的选择。 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 三、原型设计 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 四、效果图设计 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 五、布局设计 CSS技术准备：盒子模型定位：相对定位和绝对定位浮动及清除浮动后代选择器：#profiles li{…} Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 1.设置页面的整体背景 body { background-color: #cc9; background-image:url(images/background.gif); background-repeat:repeat-x; } Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 2.制作照片展示区域内容居中显示？解决方案：添加div标记，把所有的内容放入其中 div id=container…/div 样式： #container{ width:700px; margin:60px auto 0; } #container #profiles li{ float:left; padding:4px; } #container .clearboth{ clear:both;} Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 3.设置网页标题的图像替换 #container h1{ background-image:url(images/logo.png); background-repeat:no-repeat; width:137px; height:170px; } #container h1 span,#container h2