Question

当我在手机上查看我的网站或者只是缩小计算机上的浏览器窗口时，标题和链接中的元素会在主页图像后面显示。这是指向该页面的链接：http://www.sleepfullnights.com/

如何修复Shopify页面上的标题以使其压缩得很好？我认为这是一个出现在多个页面上的问题，因此非常感谢构建响应式页面的任何一般指导原则。

Answer 1

@media 查询是您正在寻找的内容。使用它们，您可以根据屏幕大小声明要应用于页面的不同样式。

如何使用它的示例：

/* apply code below on screens smaller than 1001px in width */
@media only screen and (max-width : 1000px) {
    ul li { font-size:11px; }
}

Answer 2

你可以把标题的css代码放进去吗？

你也可以尝试引导框架，它对于构建响应式网站非常有用。