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

时间:2018-01-06 11:43:25

标签: css wordpress mobile html-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>

出于某种原因,在移动设备上观看时,FIRST TD的显示方式不同=&gt;背景是灰色的(我能够摆脱它将style="background-color: #ffffff;"添加到第一个TD <>。 我遇到的主要问题是所有文本都显示为BOLD。 请问我怎么能改变这个或为什么要这样做? 该网站是: http://www.aguaris.com/en/references-mallorca-hotels/ 它对网站上的所有表格都做了同样的事情。

1 个答案:

答案 0 :(得分:0)

有一个内联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;}
}

最好尝试正确地处理它,虽然我认为,通过覆盖,你想要为网站上的所有表更正它,而不仅仅是那个。

根据那里的德语评论,通过搜索站点中的代码来跟踪文件应该很容易吗?