15158846557 在线咨询 在线咨询
15158846557 在线咨询
所在位置: 首页 > 营销资讯 > 网站运营 > 零基础创作专业wordpress网站07-制作主页(手机端)

零基础创作专业wordpress网站07-制作主页(手机端)

时间:2022-08-14 21:06:01 | 来源:网站运营

时间:2022-08-14 21:06:01 来源:网站运营



上节课,我们完成了桌面主页页面的构建,这里保存所有的更改,然后来到网站的前台,刷新这个页面,

我们发现当宽度缩小到手机宽度时,视频并没有加载,因为这是在手机的模式下,在非常小的屏幕下,视频是没有正常工作的。它和桌面的情况用的不是同一种技术,所以在手机状态下,这个效果是没有的。

为了解决这个问题,我们需要做一个备用的图片,即使在加载不出Youtube视频的情况下,也能从我们自己的服务器中加载一张正常的图片:







再来到网站的前台,试一试手机的大小:(图片正常加载哦),这就相当于任何情况下,保证图片的加载没问题。

看起来不错。

但是菜单和文字的间距过小:







所以,来修改手机上的显示效果:







确保选中的是手机,解除内距一致的限制,修改顶部距离为100:







这样,这个修改就只会在手机的屏幕中显现出来。

更新,并来到网站的前台,切换到手机的宽度,这时的效果还是不错的。

但是这个按钮还是有些不好看:







我们把它变为一行:







来到网站的前台,看看手机的效果,现在我们的网站就是完全的手机友好的。

整体概览一下,整个网站看起来非常漂亮干净,不管是桌面黑市手机都可以完美的显示,这样,我们的主页就添加好了/



关键词:创作,基础,专业

74
73
25
news

版权所有© 亿企邦 1997-2025 保留一切法律许可权利。

为了最佳展示效果,本站不支持IE9及以下版本的浏览器,建议您使用谷歌Chrome浏览器。 点击下载Chrome浏览器
关闭