Css自动截取字符串超过的部分

<style>

body{

background-color:#f4f4f4;

font-size:12px;

}

div.test{

width:200px;

height:100px;

border:1px solid red;

border-top:4px solid red;

padding:10px;

overflow:hidden;

text-overflow:ellipsis;

white-space:nowrap;

}

</style>

<div class="test">

我是测试的文字哈，超过了的部分将自动用...替换

</div>