css - WP 表格数据在移动设备上显示不同

标签 css wordpress mobile html-table

我的网站上有一张 table :

    <table>
<tbody>

<tr>
<td>
<p style="text-align: center;">
some text
some text
some text
</p>
p style="text-align: center;">
<strong><span style="font-family: Arial;">SOME BOLD TEXT</span></strong></p>
<p style="text-align: center;">
some text
some text
some text
</p>
</td><p style="text-align: center;">
some text
some text
some text
</p>
p style="text-align: center;"><strong><span style="font-family: Arial;">SOME BOLD TEXT</span></strong></p>
<p style="text-align: center;">
some text
some text
some text
</p>
<td><p style="text-align: center;">
some text
some text
some text
</p>
p style="text-align: center;"><strong><span style="font-family: Arial;">SOME BOLD TEXT</span></strong></p>
<p style="text-align: center;">
some text
some text
some text
</p>
</td><p style="text-align: center;">
some text
some text
some text
</p>
p style="text-align: center;"><strong><span style="font-family: Arial;">SOME BOLD TEXT</span></strong></p>
<p style="text-align: center;">
some text
some text
some text
</p>
</tr>
</tr>
<td><p style="text-align: center;">
some text
some text
some text
</p>
p style="text-align: center;"><strong><span style="font-family: Arial;">SOME BOLD TEXT</span></strong></p>
<p style="text-align: center;">
some text
some text
some text
</p>
</td>
</tr>

</table>
</tbody>

出于某种原因,在移动设备上查看时,第一个 TD 显示不同 => 背景为灰色(我能够将 style="background-color: #ffffff;" 添加到第一个 TD <> 来摆脱它。 我遇到的主要问题是所有文本都显示为粗体。 知道我该如何更改或为什么要这样做吗? 该网站是: http://www.aguaris.com/en/references-mallorca-hotels/ 它对网站上的所有表格都执行相同的操作。

最佳答案

某处有一个内联 css,看起来像这样,并说明了灰色和粗体:

tr td:first-child {background: #f0f0f0; font-weight:bold;font-size:1.3em;}

正如您所说,它只在移动设备上发挥作用。那是因为它包含在

@media screen and (max-width: 600px) { ...}

如果您查看源代码,您会看到代码在 99 和 171 之间,违规部分在 116 和 128 之间。代码以一些德语注释开头。

如果您无法找到该文件并以某种方式为其创建覆盖,您可能会发现将其放入您的 style.css(或 custom.css,如果您不使用子主题)即可完成工作:

@media screen and (max-width: 600px) {
tr td:first-child {background: #ffffff!important; font-weight:400!important;}
}

尽管我认为最好尝试正确处理它,但如果您想为网站上的所有表格(而不仅仅是一个表格)更正它,则可以通过覆盖。

有德文的评论,通过搜索站点中的代码应该很容易找到文件吧?

关于css - WP 表格数据在移动设备上显示不同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48127006/

相关文章:

jQuery Transit 问题 wordpress

html - 电子邮件设计 : resizing text for mobile removes mobile image swap

html - 试图隐藏浏览按钮时出现奇怪的灰线

javascript - 显示阿拉伯文字

jquery - 菜单div发送主div很远

jquery - Wordpress 自定义导航,下拉标题不可点击

Mysql根据1行更新6行

html - CSS3 进度条跳跃

assembly - 在运行时确定处理器功能

java - 如何在 android 中没有更新值的情况下只获取加速度计 X、Y、Z 值?