本文最后更新于 <span id="expire-date"></span> 天前,文中部分描述可能已经过时。

目前我的个人主页是在 threejs 开源项目的基础上自己修改而成,但主页文件过于庞大(加载缓慢),且在部分平台无法完全展示,而且恰逢寒假,时间充足,所以准备一边学习 HTML+CSS+JS,一边写个人主页,有目的的学习会让人更有动力。

其实我前段时间就写了,但是写出来的很烂,能用但不好用。

2021-12-27-18-23-22

而且也嵌入了 threejs,非常庞大,所以这次从头开始,做一个极其简洁的主页。

初步计划图示如下

手机端

2021-12-27-18-55-37

电脑端

2021-12-27-18-56-34

感觉有点空空荡荡的,到时候背景搞得花一点。

设置所有内容居中

设置文字颜色,大小

设置背景等

设置图标,超链接

调整间隔padding,调整整体布局

移动端适配

通过 javascript 判断并跳转

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
try{
var urlhash=window.location.hash;
if(!urlhash.match("fromapp")){
if((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i))){
window.location='/mobile/index.html'
}
}
}
catch(err){}
</script>

如图

2021-12-28-09-27-29

不得不说,前端还是蛮难的,主要是内容非常多。

这次就这样简简单单告一段落,回头再加东西。

本文作者:wxy

本文链接: https://c.undf.top/posts/8730864/

文章默认使用 CC BY-NC-SA 4.0 协议进行许可,使用时请注意遵守协议。

评论,秒回。

评论

如评论失效,请点击最下方的邮件图标联系作者。