php - rwd-table 字体在移动设备中不可见

Question

.rwd-table {

  margin: 1em 0;
  min-width: 300px;
}
.rwd-table tr, th, td{
	border: 2px solid #000000;

}
.rwd-table tr {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.rwd-table th {
  display: none;
}
.rwd-table td {
  display: block;
}
.rwd-table td:first-child {
  padding-top: .5em;
}
.rwd-table td:last-child {
  padding-bottom: .5em;
}
.rwd-table td:before {
  content: attr(data-th) "  ";
  font-weight: bold;
  width: 13.5em;
  display: inline;
}
@media (min-width: 480px) {
  .rwd-table td:before {
    display: none;
  }
}
.rwd-table th, .rwd-table td {
  text-align: left;
}
@media (min-width: 480px) {
  .rwd-table th, .rwd-table td {
    display: table-cell;
    padding: .25em .5em;
  }
  .rwd-table th:first-child, .rwd-table td:first-child {
    padding-left: 0;
  }
  .rwd-table th:last-child, .rwd-table td:last-child {
    padding-right: 0;
  }
}

body {



  text-rendering: optimizeLegibility;
  color: #000000;
  background: #eee;
}

h1 {
  font-weight: normal;
  letter-spacing: -1px;
  color: #000000 !important;
}

.rwd-table {
  background: #fff;
  color: #000000;
  border-radius: .4em;
  
}
.rwd-table tr {
  border-color: #fff;
}
.rwd-table th, .rwd-table td {
  margin: .5em 1em;
}
@media (min-width: 480px) {
  .rwd-table th, .rwd-table td {
    padding: 1em !important;
	  -webkit-text-fill-color: rgba(0, 0, 0, 1); 
   -webkit-opacity: 1; 
   color: rgba(0, 0, 0, 1); 
   background: white;
  }
}
.rwd-table th, .rwd-table td:before {
  color: black;
}

<table class="rwd-table">
	<tr>
		<td colspan="2" style="text-align: center; color: black;"><?php the_field( 'header_note_payment' ); ?></td>
		</tr>
	    <tr>
		<td  bgcolor="#A8CCC9" style="color: black;">Account Name </td>
		<td  bgcolor="" style="color: black;"><?php the_field( 'account_name' ); ?></td>
		</tr>
	  <tr>
		<td  bgcolor="#A8CCC9" style="color: black;">Bank Name  </td>
		<td  bgcolor="" style="color: black;"><?php the_field( 'bank_name' ); ?></td>
		</tr>

	   <tr>
		<td  bgcolor="#A8CCC9" style="color: black;">Branch Code</td>
		<td  bgcolor="" style="color: black;"><?php the_field( 'branch_code' ); ?></td>
		</tr>

		<tr>
		<td  bgcolor="#A8CCC9" style="color: black;">Account No</td>
		<td  bgcolor="" style="color: black;"><?php the_field( 'account_number' ); ?></td>
		</tr>

		<tr>
		<td bgcolor="#A8CCC9" style="color: black;">IBAN</td>
		<td bgcolor="" style="color: black;"><?php the_field( 'iban' ); ?></td>
		</tr>

		<tr>
		<td bgcolor="#A8CCC9" style="color: black;">Currency</td>
		<td bgcolor="" style="color: black;"><?php the_field( 'currency' ); ?></td>
		</tr>

		<tr>
		<td bgcolor="#A8CCC9" style="color: black;">SWIFT Code</td>
		<td bgcolor="" style="color: black;"><?php the_field( 'swift_code' ); ?></td>
		</tr>

		<tr>
		<td bgcolor="#A8CCC9" style="color: black;">Bank Address</td>
		<td bgcolor="" style="color: black;"><?php the_field( 'bank_address' ); ?></td>
		</tr>

		<tr style="text-align: center; color: black;">
			<td colspan="2"><?php the_field( 'footer_note_payment' ); ?></td>
		</tr>

	</table>

<table class="rwd-table">
<tr>
    <td colspan="2" style="text-align: center; color: black;"><?php the_field( 'header_note_payment' ); ?></td>
    </tr>
    <tr>
    <td  bgcolor="#A8CCC9" style="color: black;">Account Name </td>
    <td  bgcolor="" style="color: black;"><?php the_field( 'account_name' ); ?></td>
    </tr>
  <tr>
    <td  bgcolor="#A8CCC9" style="color: black;">Bank Name  </td>
    <td  bgcolor="" style="color: black;"><?php the_field( 'bank_name' ); ?></td>
    </tr>

   <tr>
    <td  bgcolor="#A8CCC9" style="color: black;">Branch Code</td>
    <td  bgcolor="" style="color: black;"><?php the_field( 'branch_code' ); ?></td>
    </tr>

    <tr>
    <td  bgcolor="#A8CCC9" style="color: black;">Account No</td>
    <td  bgcolor="" style=" color: rgba(0, 0, 0, 1) !important;">011 650 777 003</td>
    </tr>

    <tr>
    <td bgcolor="#A8CCC9" style="color: black;">IBAN</td>
    <td bgcolor="" style="color: black;"><?php the_field( 'iban' ); ?></td>
    </tr>

    <tr>
    <td bgcolor="#A8CCC9" style="color: black;">Currency</td>
    <td bgcolor="" style="color: black;"><?php the_field( 'currency' ); ?></td>
    </tr>

    <tr>
    <td bgcolor="#A8CCC9" style="color: black;">SWIFT Code</td>
    <td bgcolor="" style="color: black;"><?php the_field( 'swift_code' ); ?></td>
    </tr>

    <tr>
    <td bgcolor="#A8CCC9" style="color: black;">Bank Address</td>
    <td bgcolor="" style="color: black;"><?php the_field( 'bank_address' ); ?></td>
    </tr>

    <tr style="text-align: center; color: black;">
        <td colspan="2"><?php the_field( 'footer_note_payment' ); ?></td>
    </tr>

</table>

我也添加了 css 代码和 html 代码，请让我知道我到底哪里出错了。过去两天一直在与这条特定线路作斗争。

尝试使用不同的 css 样式，但在桌面屏幕上一切正常，但在移动屏幕上，仅显示标题，即帐号。

Answer 1

不应该是<?=the_field('account_number')?>吗？顺便说一句，“帐号”不是标题 - 它只是前一个单元格，一个兄弟单元格。