网站仅使用NextJ和tailwind在移动设备上的一半页面上渲染
也许有点愚蠢,我选择使用我以前从未使用过的两种技术来制作我的投资组合网站 - 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
Many thanks,
Zan
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您的父映像具有固定的宽度,尝试将其删除或添加最大宽度。
Your parent images have a fixed width, try to remove it, or add max-width.