一、实验需求:上位机软件界面设计
二、技术选型:前端(HTML CSS JavaScript)
三、实验准备:Sublime3、webstorm64、Google Chrome
四、实验说明:
所谓前端,简单来说就是做网页;
1、利用HTML(超文本标记语言)的众多标签来实现页面的一个基本结构,就是页面应该包含哪些内容,例如表格、表单、文字、段落、按钮等;
2、再通过CSS(层叠样式表)来进行修饰,所谓修饰就是为了让其看起来更美观,就比如字体的颜色、大小,背景颜色、定位等等,一般根据个人审美来进行装饰;
3、而JavaScript是一种脚本语言,用来定义行为的,让页面变成动态页面,一般我们所看到的页面动态效果一般都是JavaScript实现的,当然后来还有更新更方便的技术,但JavaScript是基础;
五、实验过程及分析:
实验截图:
1、这次实验我们做的是超市系统的第一个实战演练的界面;
2、标头四个页面的转换使用的是一个插件,这里就不过多的解释了;
3、第一个标题下面的界面,添加了表格table标签、按钮input标签,以及独成一行的p标签,再利用position进行定位,分为上(左右)、下三个部分,再对样式稍加修改可以得到如图所示的效果;
六、实验小结:
1、感觉使用前端的一些样式会比较灵活多变,可以根据自己的想法设计想要的样式,而且更方便得到结果,代码也比较好理解,比较语义化;
2、定位排版会比较麻烦,需要计算一下偏移量,以及要通过对原图的理解,要知道该效果是通过什么标签得到的,什么标签可以实现这个文本等等问题;