如何切断左侧的溢流

只需将文本的方向更改为 从右到左 通过 direction: rtl;

div {
  width:50px;
  background: red;
  overflow: hidden;
  white-space: nowrap;
  direction: rtl;
}

WORKING DEMO .

我应该注意到,通过更改 direction ,的感叹号 Hello World! 将向左移动 !Hello world .

为了解决这个问题,您可以通过 <bdi> 元素如下:

<div>
   <bdi>Hello World!</bdi>
</div>

UPDATED DEMO .

或使用 unicode-bidi: isolate 在 <span> 元素(用于 supported web浏览器)

只需将direction属性设置为rtl:

div{
    direction:rtl;
    width:50px;
    background: red; 
    overflow: hidden; 
    white-space: nowrap;
}

工作示例: http://jsfiddle.net/5Hj3Q/