解决方案:从父 div 中删除字体系列、字体大小和颜色。
编辑:仅当我按 CTRL + F5 时才会出现问题
EDIT2:我将问题追踪到 .site-footer: position:absolute; .似乎如果我将其更改为相对问题消失了。
我正在开发的网站上遇到一个奇怪的错误。有2个问题:
有时文本根本没有显示(尽管文本的边框正在显示)但是当我将鼠标悬停在它上面时,它开始显示。
文本是故障 例如:文本不是“SYDNEY”,而是“TZDOEZ”,我必须刷新页面或更改浏览器窗口尺寸才能消除问题。
有没有其他人遇到过这个问题?
只是要清楚:
文本与背景颜色不同。
文本是由纯 html 而不是 Javascript、PHP 等插入的
我使用来自 Google Fonts 的 Open Sans 字体。
无论我使用什么字体,它都会发生。
<footer id="colophon" class="site-footer" role="contentinfo">
<div class="full-width">
<div class="left">
<ul class="footer-list">
<li><a href="#">Sydney</a> <span>Tel: +00 0 000 0000</span></li>
</ul>
</div>
<div class="right">
<ul class="footer-list">
<li><a href="#">Sydney</a></li>
</ul>
</div>
</div>
CSS:
.site-footer {
position: absolute;
bottom: 0;
left: 0;
right: 0;
width: 100%;
background: #000000;
padding: 10px 20px;
font-family: 'Open Sans', sans-serif;
text-rendering: optimizeLegibility;
font-size: 13px;
color: #bcbcbc;
}
.footer-list li {
display: inline-block;
padding: 0 9px;
border-right: 1px solid #666666;
}
.footer-list a, .footer-list span {
display: block;
color: #ffffff;
font-family: 'Open Sans', sans-serif;
font-size: 13px;
}