网站仅使用NextJ和tailwind在移动设备上的一半页面上渲染

发布于 2025-02-06 17:32:08 字数 457 浏览 1 评论 0原文

也许有点愚蠢,我选择使用我以前从未使用过的两种技术来制作我的投资组合网站 - tailwind和NextJS。

在开发投资组合时,我已经通过移动浏览器打开了它,并惊讶地发现这些组件仅在半屏幕上渲染。当我在台式机上的浏览器中手动重新装置设备宽度时,这不会发生。

在index.js中,我有以下元标记,我认为可以解决这个问题,

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

有人会知道为什么会发生这种情况吗?

我的代码部署到 github

​ ZAN

Perhaps a bit foolishly, I have chosen to do my portfolio site with two technologies that I have never worked with before - Tailwind and NextJS.

while developing the portfolio, I have opened it via my mobile browser and was surprised to see that the components are rendering on half screen only. This does not happen when I refit the device width manually in the browser on the desktop.

In index.js I have the following meta tag, which I thought could fix the issue

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

Would anyone have idea why that happens?

My code is deployed to github

Mobile picture of the portfolio

Many thanks,
Zan

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

您的父映像具有固定的宽度,尝试将其删除或添加最大宽度。

Your parent images have a fixed width, try to remove it, or add max-width.

enter image description here

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文