1

我真的很难过这个。我正在尝试使用 Dan Mall推荐的一种技术来设置换行符,但在移动设备上使用 html 电子邮件签名,就像支持媒体查询的渐进增强一样。我在表格单元格中执行此操作,但我试图通过跨度或br带有类的标签在文本中执行此操作,而不是将媒体查询应用于 a tror td。但是,即使在 Chrome 中进行测试,媒体查询似乎也根本不适用。对于我的媒体查询,我正在做:

@media screen and (max-device-width:480px) {
  span[class="rwd_hidden"] { display:visible !important; }
  br[class="rwd_break"] { display: none !important; }
}

@media screen and (min-device-width:481px) {
  span[class="rwd_hidden"] { display:hidden !important; }
  br[class="rwd_break"] { display: hidden !important; }
}

以及我的 HTML 中的适用部分:

<span style="font-family:Geneva,Tahoma,Arial;
font-weight:bold; color:#5D889D; font-size:11px; line-height:20px;">Office</span>
<span style="font-family: Tahoma,Verdana,Arial; font-weight:normal; font-size:12px; line-height:20px; color:#304958;"><a href="tel:000000000" style="text-decoration:none; border:none; color:#304958;">(000) 000-0000</a></span>
&nbsp;<br class="rwd_break" />
<span style="padding:0; color:#D4E3E9;" class="rwd_hidden">|</span>&nbsp;

只是在这里尝试括号类定位,因为我读过雅虎有时会绊倒 - 我已经做到了两种方式。主要只是试图用两个电话号码打破一条长线,仅在手机上,并隐藏管道分隔器,但没有运气。有什么帮助吗?通常不可能在表中使用 MQ 来定位事物吗?

4

1 回答 1

2

您的媒体查询很好。只是“可见”不是该display:属性可接受的选项——我想你可能displayvisibility.

我认为 Dan Mall 的原始方法在这里应该没问题。看起来您也在使用.rwd_hidden,所以我已将其添加到他的代码中。

@media screen and (min-device-width:481px) {
  .rwd_hidden,
  .rwd_break {
      display:none;
  }
}
于 2017-03-04T23:29:21.410 回答