html - 使用CSS使文本在溢出时消失

Question

我在 HTML/CSS 页面上创建了以下标题栏:

  <div class="topmenubar" style="position:relative;background:maroon;height:40px;">
    <div id="menupadding" style="position:relative;left:30px;right:30px;">
      <table style="width:100%;">
        <tr>
          <font class="headerfont">
            <td>BeccasMap.com</td>
            <td style="text-align:right;position:relative;right:60px;white-space:nowrap;overflow:hidden;">Best upcoming Tech events in NYC</td>
          </font>
        </tr>
      </table>
    </div>
  </div>

我希望在将窗口调整为较小时，文本“纽约市即将举行的最佳科技事件”消失，但我不确定如何执行此操作。我试过 how to hide too long texts in div elements? 中的建议它对我不起作用。非常感谢您的帮助。

Answer 1

检查这个:http://jsfiddle.net/eKgG8/5/

@media only screen and (max-width : 400px){
    .limit{
        display:none;
    }
}