前年参加校内网页设计大赛的网页,当时没有跟课程系统学习过,也没有良好的代码书写习惯,导致许多id、class甚至是文件层级结构都比较混乱

现在分享出来,或许可以当个大作业用用,或许这种混乱的起名规则非常适合初学者做大作业

  • 使用的Bootstrap框架,搭配AOS动画实现了整体页面的动态效果,其他小图标和鼠标指针来源忘了...
  • 配色方面由于没有找到其它更合适的四方连续图(穷),主动适配了背景图的色调
  • 有针对不同设备的适配内容,包括手机、平板、PC的不同效果,并对不同设备的页面布局稍有调整,主要体现在顶部导航栏
  • 二级网页基本都写了大概,一般可以点的按钮都有对应效果

其实是模仿某网站制作而来的,算是完成了一个梦想吧

[SHANA]OrangEdge

在此附上工程文件,阅读性真的非常差

链接:https://pan.baidu.com/s/1PcDmGVuneq75W97tWGwhGg 
提取码:d66n


前不久被人问到这个东西是不是很复杂,技术细节该怎么讲

这个东西是我在磕磕绊绊写出来百度页面后,边学边做一星期完成的,在此之前我没有任何的代码书写基础。但不得不承认,最终的成品效果确实令人惊艳,但这是站立在巨人的肩膀上眺望远方罢了,如果你有需要,一些套话如下:

本网页是基于Bootstrap网页框架开发实现了整体网页内容的模块设计,充分使用了Bootstrap成熟的栅格结构,让页面可对不同平台做出更好的适配

同时引入AOS动画库,让页面变得更加灵动多样,与众不同

在用户关怀方面,我在不同平台对菜单布局做出了适配性调整,并自定义了页面内指针与网页小图标

限于素材有限,我决定基于素材图片对网页整体设计进行适配,由于使用了以蓝橙黑为主色的四方连续图作为网页背景,因此对整体配色的把握也,往这方面靠拢,让界面整体统一;网页模块吸收Vista系统设计风格,多采用毛玻璃效果,让页面观感良好,用户体验更好

限于本人水平以及时间限制,未能完成所有二级页面的设计,在此深感惭愧


上面那段故事还是挺离谱的,因为我发现在工程文件里包含了我的报名表......

信息是无误的,如果你有什么问题也欢迎来唠嗑


不知不觉已经四年过去了,我的本科生涯也即将结束

每年期末都会有人来找我聊天,甚是感慨

今天开个表格,有人用过这个项目的,或者是想用的,可填一下,防止用重了,也是留个纪念

【腾讯文档】期末必过
https://docs.qq.com/sheet/DWkhxd1ltdXhicENo?tab=BB08J2

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐