网页设计与制作课程设计报告

《网页设计与制作课程设计》实验报告院系名称：管理学院专业班级:电子商务XXX学生姓名：XXX学号：XXXXXXX网页界面网站栏目网站功能（JS程序）合计50分10分40分100分2019年06月一、实验目的本实验属于设计性实验，在学习完《网页设计与制作》课程的基础上，通过实验学习网页制作的步骤与方法，使用CSS+DIV制作一个简单的网站，能够对网站有一个清晰的认知和规划。进一步熟悉和领悟HTML语言、CSS样式表和JAVASCRIPT语言的语法结构。将理论与实践相结合，加深对本课程的理解。二、实验步骤1、进行网站整体规划，包括网站主题、栏目以和界面的构思，确定网站结构，形成初步设计思路。2、设计网站的主页以和栏目，利用CSS+DIV制作网站主页和弹出式导航条菜单，利用JavaScript制作动态效果，并用firework软件对主页进行第第#页<ulid=〃sddm”>li>首页<li>美妆<li>服饰<li>零食<li>母婴<廿>关于我们<liid二〃sddm1〃>在售分类</ul>palign=〃left〃>您的位置>美妆>女士护肤>洁面<hrsize=〃1〃></p>div id二〃content〃 align二〃center〃><div id二〃content1〃><imgsrc二〃images/list1.png〃border=〃0〃><br>洁面膏<br>尺码：100g<br>洁面膏彻底清除堆积在毛孔里的污垢和角质细胞，用后清爽无比</div>divid二〃content2〃><imgsrc二〃images/list2.png〃border=〃0〃><br>草本青春洁面慕斯<br>规格：150mL<br>草本青春洁面慕斯150mL,蕴含有丰富的植物油和植物萃取，质地温和绵密，能够温和的清洁皮肤</div><divid二〃content3〃><imgsrc二〃images/list3.png〃border=〃0〃><br>玫瑰衡肤保湿洁面乳<br>尺码：80g<br>玫瑰衡肤保湿洁面乳80g,蕴含丰富的玫瑰果油，可提升肌肤水分含量<br></div><divid="content4"><imgsrc="images/list4.png"border="0"><br>衡肤泡沫洁面液^丫>尺码：200mL<br>衡肤泡沫洁面液，玫瑰、绿茶和药蜀葵和多种植物活性成份可以轻柔的去肌肤表面污垢<br></div></div><divid="bottom"style="text-align:center"><hr><p>官方微信：4783952zxx<br>©版权所有  <aherf="mailto:"></a></p></body></html>五、实验总结在本次网站页面设计中，首先要整理清楚构思，根据CSS样式以和DIV块化设计完成代码设计。其中对于Javascript的应用主要体现在三个方面：下拉菜单的动态效果，用户登录的表单验证以和图片轮播的动态效果。我在本次试验中最大的困难是有关盒子的宽高、边界以和悬浮等属性，如何利用DIV模块将内容悬浮至水平排列，以和如何将用项目编号嵌套的新闻列表排列展示等。伴随着这些问题的解决，我对CSS中的宽高属性以和边框属性有了一个更为清晰的认知。另外，由于网站的主题选定为“轻奢电商”，因此，图片的展示要多于文字的展示，图片的作用更为重要，在此过程中，可以用Fireworks软件进行切图，这是网页必不可少的元素。网页设计是一个前端的操作，对界面的设计和把握主要要求我