基于bootstrap框架的动漫影视网站设计与实现.docx

《基于bootstrap框架的动漫影视网站设计与实现.docx》由会员分享，可在线阅读，更多相关《基于bootstrap框架的动漫影视网站设计与实现.docx（15页珍藏版）》请在课桌文档上搜索。

1、动漫网网站设计与制作报告学号：姓名:自评成绩：一、总体介绍微动漫是中国新媒体动漫的发展趋势。新媒体传承了传统媒体的特性，将文字、图画图像、声音等多种载体有机合成，以图文并茂、声形辉映的信息刺激方式同时作用于受众的视觉和听觉神经。新媒体的出现，使动漫作品的传播如虎添翼。网站名称：动漫书店网站主题：通过网站宣传，提高动漫的知名度。输入法网站语言：简体中文网站风格：以白色为主，给人一种简洁的感觉，主题鲜明突出，要点明确，以简单明确的语言和画面体现站点的主题，表现网站的个性和情趣，办出网站的特点。首页设计：页头：log。与导航条页面：动漫的展览。二、网站的主要功能模块网站分别为：网站首页、你的名字页、

2、声之形页、天气之子页、魔女宅急便页、站长简介页、给我留言页.网站首页：顶部是导航栏，往下就是网站基本都有的轮播图，轮播图覆盖导航栏，轮播图的下面是动漫电影的经典语录，鼠标移动到图片上面图片将会放大一点，并会出现改图是来源于哪部动漫电影。再往下是导演简介模块、电影人物模块、电影介绍模块。最后是页脚，标注着我的著作信息，每一个页面的导航栏和页脚都是一样的。你的名字页：展示你的名字的精彩图片。声之形页：介绍该电影的人物。天气之子页：介绍该电影的人物。魔女宅急便页：介绍该电影的人物。站长简介页：展示我的个人介绍。给我留言页：留言表单，可以给我留言。三、网站导航结构设计网站的目录结构图如下：动漫网站网站

3、首页你的名字声之形天气之子魔女宅急便站长简介|给我留言左边是网站的logo,右边是网站导航栏，导航栏中的你的名字页和天气之子页有二级导航,网站共有7个链接。网站的logo如下：你的名字页二级导航栏分别为：人物介绍、剧情介绍。效果图如下：天气之子页二级导航栏分别为：人物介绍、剧情介绍、声优介绍、评论交流。效果图如下:逐页截图，并介绍每一个页面的CSS效果及js动态效果，使用到的关键技术、亮点。轮播图关键技术：这段代码还使用了HTML中的div、等标签来定义轮播图的结构以及显示的图片。每个标签的SrC属性指定了要显示的图片路径，alt属性提供了当图片无法加载时的替代文本。亮点：使用“SlickCa

4、r。USer技术，实现了一个响应式和可交互的图片轮播效果。图片轮播具有自动轮播、无限循环、切换效果等功能，提升了用户体验。通过HTML中的、等标签，定义了轮播图的结构及显示的图片，并提供了替代文本，增加了可访问性。主要代码：页脚部分的关键代码：长沙理工大学；软件工程2103班；姓名：谢倭计算机与通信工程学院；学号：202101030103首页：经典语:电影介为ltn*VWKUER.你的名字页：使用了HTML和CSS来构建网页结构和样式。还使用了懒加载(LazyIoad)：在class属性中可以看到“imgloading”，这表明使用了懒加载技术来延迟加载图片。懒加载可以提高页面加载速度，提升用

5、户体验。还使用了表格布局(TableLayout):使用table元素和tbody元素来创建了一个表格布局，将图片排列在多个单元格内。WMtI*;ttAUS2XMI.HMitWMiflIR114R;*HM210WWKB关键代码：,声之形页、天气之子页、魔女宅急便页：这三个页面的模块都相识，关键的技术和亮点页差不多。.:这是一个横幅部分,用于显示一个图片，其中data-height=是用于设定高度的属性。.:这是一个容器，用于包含介绍内容。.:这是一个行元素，用于在网页中创建一行。.:这是一个占据9个网格空间的列元素，用于显示人物介绍内容。.:这是一个行元素，用于在网页中创建一行。.:这是一个无

6、序列表,其中met-page-ajax是用于加载更特性，data-scale=Q71428571428571是用于设定比例的属性。每个liclass;代表一个人物的介绍，其中包含了、描述、发布日期和浏览次数等信息。.是用于显示人物左侧内容的容器。.是用于显示人物主要内容的容器。h4CIaSS=media-heading”,是人物的名称。.是人物的描述。.是人物的信息，包括发布日期和浏览次数。.是一个分页器，用于显示当前页数和总记录数。关键代码：石田将也L?演员:-配音:入野自由（高中生）、松冈茉优（小学生）、王晨光（普通话）小孩子时期是孩子王。但是自从出了硝子的事情以后就被周围的人孤立。一直都

7、活在孤独和自我厌恶中2023-6-24104Aia4*IOMtrAT.tWITJS2XXMR.BfiMUMUiMImt;*H:202,0101g天气之子页:森岛机高UBMWtXM(t8),KMTC三HfS89中集.MffTn*.KKEKA.JtHfttMBMlWWMSMMtetIL.魔女宅急便页：7须货美s*田nIBD.ss)-eft*s*ftTae金;BSrjftx*?.绅妻介m女.HWWMWisn.SwWJ三三*m人的复-天野瓜KSBWKA(83)反身RI(Mt!)阳卬第弟.，J，(S*0h主ISita卑SvutMaeimBAVHaMaavaW9nrr.JtwueiesauMffi94*e

8、*长MI大学；nuw;MfifitlWV*i三IKH*；TH：1010W1SRasM的-MZJV天2,a&KWVttK3魔女宅急便介绍BXA*k99CJLCK.南小N风过主岁,R9D.ItffMTTWA2014lE3P111ffH*i3e1.谖HHHWfctMWlPIQ-，W了W习Ie女BWa开父母in通立与充NF的jrg交接的迫电中喇H”正3怆“覆琪琪Sirjc三aari6Bx*aa20ZM-240Mlto三re.tmn三iM三.ns”itnmiRvct;学?必。，018站长简介页：关键代码：站长简介我是长沙理工大学软件工程专业的一名学生。在师友的严格教益及个人的努力下，我具备了扎实的专业基

9、础知识，系统地掌握了等有关理论;熟悉涉外工作常用礼仪;具备较好的英语听、说、读、写、译等能力;能熟练操作计算机办公软件。同时，我利用课余时间广泛地涉猎了大量书籍，不但充实了自己，也培养了自己多方面的技能。在校期间，我认真学习，勤奋刻苦，努力做好本职工作，在学生会和班级工作中积累了大量的工作经验，使自己具有良好的身体素质和心理素质。几年来我努力学习专业知识，从各门课程的基础知识出发，努力掌握其基本技能技巧，深钻细研，寻求其内在规律，并取得了良好的成绩，获过校一等奖学金。此外，我还积极地参加各种社会活动，抓住每一个机会，锻炼自己。我深深地感受到，与优秀学生共事，使我在竞争中获益向实际困难挑战，让我

10、在挫折中成长。专项技能：熟悉C+和ffmpeg,熟悉流媒体中ffmpeg的使用，熟悉RTMP1HLS流媒体协议,熟悉音视频格式和编解码，熟悉音视频的采集,了解经常用到的直播流分辨率,以及流的构成，熟悉Android的JNI/NDK开发,能实现JAVA与C/C+程序间的互调,能完成工作中推拉流相应底层代码，熟练掌握Android源码以及frameWork原理,有较好的java基础，熟练掌握AndroidIPC机制、VieW的事件体系以及工作原理，熟悉Socket及时通讯原理和Android大图分片加载处理，画，熟悉Handler、Message、LOOPer消息机制及ASynCTaSk异步任务机

11、制，熟悉View和ViewGroup的事件分发机制以及线程和线程池，熟练自定义View、animation,能够根据需求定义出相应的自定义控件和动熟练掌握RetrOfit、RXJaVa、OkHttpsXUtilS等三方开源Iibrary,熟悉AndrOid应用性能优化的实现（LiStVieW优化、防止内存溢出和图片三层缓存机制等），熟练使用各种UI控件，具有控件冲突解决能力，能实现页面和动画视觉效果，熟悉MVC.、MVP和单例模式、装饰者模式、工厂模式等。效果图：站长箭介Mrs.RC3pLSitaHtMiMlMXSaM&WOMm.MftiRWSXS.IMff用HeBUIWSU=.MAmKKtI

12、MMXflR.iC*3MKX!Wmtt3Z(tT4ffiMMKK.MSB*MKM*mK*aro0UB*.WfiHMMLMMAneKxlffCfW.MwW11*JIWanJB三,B3oc*XBKISiRAmaAMIOdtMHKxaHtIV.RAMnet.Me*MeLMPcrMMIMjIAnnCTMkmfHMMIVMwMIGnMffiWlzmMWttKIOttlUI.MOSSW*EaKnIt*义出mu隼纳”DM.VAWMrot.O.BIM7&iWtJM0mMVl.MttfftMtuem.KMttmtfKfttn.IemESlCiMMe9.MMC.MVHQIMncMMMhCInRK9.HiMrlA学

13、；WITW2K11M;KMVItavUlNaTKVCt;211MOWWXB给我留言页：包含了一个站长简介的图片和一个表单。图片地址为“picture/77.png”，在页面中使用了一个div元素来展示该图片。表单部分包括了QQ、邮箱、联系方式、意见反馈和详细内容等输入项，用户可以填写相关信息并提交。关键代码：QQ邮箱联系方式意见反馈详细内容提交效果图：Ki尔T大学；ttttTW2TO3三;:Wfl计MWM9R;学号：2021018018四、总结通过本次的网站设计开发，我学到了很多东西，实训的过程中我尽量充分利用老师教过的知识，对所学知识进行了巩固。把所学的知识进行融会贯通，通过遇到的难题就要想办法去解决它，有从百度，B站上去找疑问、解决问题，从而获取新的知识。掌握了html、CSS、javascript等前端开发技术，能够灵活的运用所学的知识和技巧制作出简单的网页，还学会了使用各种前端框架和工具，例如：BoOtStrap、React,VUe等，提升了页面的交互性。在未来的工作中，我会不断学习和实践，完善自己的知识体系结构，提高自己的技能水平。同时，我也会从这次经历中汲取教训和经验，以便更好地应对未来的挑战。