音乐播放器 + 返回顶部开始
❚❚
音乐播放器 + 返回顶部代码结束

博客背景图思路

想记一下我自己的思路,今天出去旅游,不记一下回来后都忘得九霄云外。

首先博客的主框架是1190px,所以使用1200px的背景图,本来可以用HTML5 Video也可以没有地方上传视频,就算有能用多久上传视频网站的速度也无法保证,
所以采用b计划园里面直接上传照片,最大图片限制2mb,用webp动图。
image
为啥不直接用1920px而改用1200px,现在电脑屏幕分辨率越来越大,4k的2k的,图片越大体积越大,1200px直接和主框架同宽两边用颜色填充可以适配任何分辨率,而且还有webp的2mb限制,所以背景图越小加载的越快,就是2mb展示的细节有点少,但是不能兼得。直接把图片根据分辨率无限放大图片清晰度就变低了,处女座无法接受。

所以最终的代码部分 分辨率在1200px以内进行100%缩放并为移动端单独设置最小高度300px,当分辨率超过1200px就把尺寸固定在1200px乘350px不进行缩放背景图居中并把两侧留白用和背景图接近颜色填充并保留背景图上面的遮罩层。

暂时想到这么多,本身做博客就是玩和打游戏一样会一点点变好。

还想到有一个点子就是首页用的图片可以添加文字显得更有意义,文章页面的背景图使用没加东西的图片,以后再补充

保留遮罩层

一些记录都在电脑的桌面保存的,回来可以看看

posted @ 2025-07-12 10:13  余许伟  阅读(116)  评论(0)    收藏  举报