gpt4 book ai didi

css - 行高不适用于我的投资组合网站的移动设备

转载 作者:行者123 更新时间:2023-11-28 02:43:05 24 4
gpt4 key购买 nike

堆栈溢出的新手,但我在这方面苦苦挣扎。我最近创建了我的投资组合网站,它似乎可以跨所有设备断点和笔记本电脑上的 Chrome 媒体查询工作。但是,当我在手机上访问该网站时(尝试了 Chrome 和 Firefox),标题行高消失了。它是嘎吱嘎吱的,不可读的。任何想法可能会发生什么?我真的很感激!似乎无法调试,因为它只能通过移动设备进行。

.text--header {
font-size: 30px;
line-height: 38px;
display: block;
font-stretch: none;
margin-top: 95px;
}

@media screen and (min-width: 320px) and (max-width: 630px) {
.text--header {
font-size: 30px;
letter-spacing: -0.04em;
line-height: 32px;
}
}
<div class="ct ct--body">
<span class="text text--header">Jenna is a Product/Visual Designer.</span>
</div>

最佳答案

实际上,媒体查询的问题不会忘记遵循媒体查询的标准声明。

.text--header { 
font-size: 30px;
line-height: 38px;
display: block;
font-stretch: none;
margin-top: 95px;
background-color: #ccc;
}
@media only screen and (min-device-width: 320px) and (max-device-width: 630px) {
.text--header {
font-size: 30px;
letter-spacing: -0.04em;
line-height: 32px;
background-color: red;
}
}
<meta name="viewport" content="width=device-width" />
<body>
<div class="ct ct--body">
<span class="text text--header">Jenna is a Product/Visual Designer.</span>
</div>
</body>

感谢它是否有用:)

关于css - 行高不适用于我的投资组合网站的移动设备,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47067494/

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