gpt4 book ai didi

css - 网站在手机上看起来不太好

转载 作者:太空宇宙 更新时间:2023-11-04 12:05:25 25 4
gpt4 key购买 nike

我是 CSS/HTML 的新手。我创建了这个网站,我希望它在手机上看起来也不错。当我从我的 iphone 浏览该网站时,它以最大速度向外滚动,并且来自 frow(第一行 - £20 代金券)、srow(第二行 - 在)、trow(第三行 - £4.99)的文本非常小,不可读。怎么了?

.frow {
font-size: 60px;
font-weight:900;
}

.srow {
margin-top:10px;
line-height:5px;
font-size: 45px;
font-weight: 600;
}
.trow {
color: #FF0000;
text-shadow: 2px 2px #000;
font-size: 100px;
font-weight: 900;
}

最佳答案

您必须定义元视口(viewport)才能以您想要的方式支持移动设备:

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">

将此包含在您的 <head> 中.如果视口(viewport)没有定义其他内容,现代移动浏览器通常会缩小页面。使用视口(viewport),页面不可缩放 (user-scalable=no),因此它看起来就像在一个小窗口中打开。

下一步将是(如果尚未完成)使该页面可在小屏幕分辨率下使用。为了实现这一点,CSS 媒体查询可能会有所帮助。

关于视口(viewport)元标记:http://html5-mobile.de/blog/meta-viewport-fuer-mobile-anpassen

关于 CSS 媒体查询:http://www.w3schools.com/cssref/css3_pr_mediaquery.asp

关于css - 网站在手机上看起来不太好,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29420725/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com