大伙儿今天我来给大家伙儿分享一下我最近瞎捣鼓的一个玩意儿——就是给《圣骑士大人与魅魔从者》这游戏做了个类似“官网”的东西。纯属个人兴趣，也算是记录一下过程。
为啥想搞这个？
也没啥特别高大上的理由。就是前段时间玩了这款RPG，觉得挺有意思的，圣骑士配魅魔从者，这设定反差挺大，挺戳我的。然后就想着，能不能自己动手给它弄个简单的介绍页面啥的，权当练练手，也方便自己以后回顾或者给同好们瞅瞅。
开干前的准备
说干就干。我先琢磨了一下这官网得有啥内容。主要思路就是：
小编温馨提醒：本站只提供游戏介绍，下载游戏请前往89游戏主站，89游戏提供真人恋爱/绅士游戏/3A单机游戏大全，点我立即前往》》》绅士游戏下载专区
- 游戏的基本介绍，比如是啥类型的，大概讲了个啥故事。
- 主要角色的介绍，圣骑士由利大人和魅魔科蒂娅肯定少不了。
- 游戏的一些特色或者亮点，比如那个画风，剧情冲突啥的。
- 再放点游戏截图或者官方宣传图，养养眼。
工具方面，我没用啥复杂的东西，就最基础的文本编辑器，手敲HTML和CSS。咱这水平，也就会点这个了，哈哈。
一步步搭建过程
第一步，规划页面结构。我就想着弄个单页面滚动式的，或者分几个简单的栏目。还是决定分几个小页面，导航清晰点。弄了个首页、角色介绍、故事背景、还有个图集。
第二步，收集素材。这个比较费事儿。我得到处找游戏的高清截图、官方立绘啥的。有些图质量不行，还得自己稍微处理一下。文字内容嘛一部分是回忆游戏剧情自己写的，一部分是参考网上一些大佬的评测和介绍，自己再组织语言。
第三步，开始码代码。先搭了个基本的HTML框架。顶部一个导航栏，中间是主要内容区，底部随便放点版权信息（虽然是自己搞着玩的）。
首页的制作：我放了张比较有代表性的游戏宣传图当背景，上面是游戏的大标题“圣骑士大人与魅魔从者”，再加一句简单的Slogan，比如“正义与魅惑的交织”之类的，唬人嘛
角色介绍页：这里我给由利和科蒂娅都单独列了出来。左边是角色立绘，右边是角色的简单介绍，比如性格、背景故事的简述。用<strong>标签把角色名字加粗了一下，显眼点。
故事背景页：这块儿就是把游戏开头的剧情和主要的世界观设定给概括了一下。尽量写得吸引人一点，但又不能剧透太多。
图集页：这个简单，就是找了些游戏里的CG和精美场景图，做了个简单的图片画廊效果。点小图能看大图那种。
第四步，美化页面（CSS部分）。这块儿我真是个半吊子。就想着整体风格要符合游戏的感觉，圣骑士的神圣感和魅魔的神秘诱惑感都得有点。所以主色调我选了点暗色系，比如深蓝或者暗紫色，然后用金色或者亮银色做点缀。字体也选了个稍微有点艺术感的，但又不能太花哨影响阅读。调整行间距、字间距，让排版看着舒服点。这过程真是反复调试，改了又改，对着浏览器F12看了无数遍。
最终效果和总结
折腾了好几天，总算是把这个简陋的“官网”给弄出来了。虽然功能简单，也没啥酷炫的特效，但看着自己一行行代码敲出来的页面，还是挺有成就感的。整个过程下来，对HTML和CSS的理解又加深了一点，特别是布局和选择器那块儿，以前模糊的地方清晰了不少。
这回实践也让我明白，想做一个东西，哪怕很小，从构思到实现，中间还是有很多细节要考虑的。虽然成品简陋，但这个过程本身就挺有意思。以后要是再碰到啥喜欢的游戏或者有啥新点子，估计还会这么折腾一番。分享完毕，谢谢大家听我唠叨！
