gpt4 book ai didi

android - CSS 来显示响应式 Nag Bar?

转载 作者:行者123 更新时间:2023-11-28 11:54:10 25 4
gpt4 key购买 nike

我们正在使用一个名为“Covert PinPress”的 WordPress 主题,它基本上是 Pinterest 的仿制品。

这是一个示例页面:

http://shoeporn.com/iron-fist-death-dance/

顶部的 #header_banner 黄色横幅可以在笔记本电脑/台式机上查看,但不能在移动设备上查看。

很清楚为什么,因为在主题的 style.css 中,它有:

@media only screen and (min-width: 480px) and (max-width: 768px) {
#header_banner { display: none; }
}

@media only screen and (max-width: 480px) {
#header_banner, #header #search {display: none;}
}

如果我要删除这些条目,横幅会出现在我的 Android 上,但它看起来很糟糕。它太宽了,并且与页面上的其他对象重叠。

画面:

Android screenshot

有什么想法可以修改 CSS 使其在所有设备上看起来都不错吗?提前致谢:)

最佳答案

@media only screen and (min-width: 480px) and (max-width: 768px) {

header_banner { 宽度:100%;字体大小:你需要/想要的大小!重要; .nag-bar-widget { 宽度:90%;

} }

说明:您必须更改赋予元素固定大小的样式属性。您需要的 !important,因为 span 元素的字体大小是在 html 文档中定义的。

如果有什么不清楚的,请告诉我。

关于android - CSS 来显示响应式 Nag Bar?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20176237/

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