<ul>        
    <li class="current">
        <a href="./">Home</a>
    </li>           
    <li class="">
        <a href="./location/">Location</a>
    </li>           
    <li class="">
        <a href="./rooms-and-rates/">Rooms &amp; Rates </a>
    </li>           
    <li class="">
        <a href="./facilities/">Facilities</a>
    </li>           
    <li class="">
        <a href="./things-to-do/">Things to do</a>
    </li>           
    <li class="">
        <a href="./eating-and-drinking/">Eating and Drinking</a>
    </li>           
</ul>

当菜单标题太长时,我需要使用文本溢出：省略号,所以我在我的CSS中像我的菜单链接样式：

header nav ul li a { text-decoration: none; 
       text-overflow: ellipsis; 
       display: block; 
       overflow: hidden; 
       width: 150px; 
       height: 32px;
}

然而,期望的效果不会发生.它只是切断整个最后一个字(并将其包裹在不可见的地方).我的代码有什么问题,还是有一些注意事项,我不知道文本溢出：省略号？