css3 - text-overflow為何會在li的子標簽a下失效
問題描述
<ul> <li><span>2014-05-28</span><a href='http://www.b3g6.com/wenda/news.html'>這不是廣告這不是廣告這不是廣告這不是廣告這不是廣告這不是廣告這不是廣告這不是廣告這不是廣告這不是廣告這不是廣告</a></li></ul>
設置的CSS如下
li{ overflow: hidden; white-space: nowrap; text-overflow:ellipsis; width: 747px;}
為什么給a設置同樣的樣式會失效,而li不會
問題解答
回答1:設置 a { display: inline-block; } 即可。
Text overflow can only happen on block or inline-block level elements, because the element needs to have a width in order to be overflow-ed. The overflow happens in the direction as determined by the direction property or related attributes. - via: https://css-tricks.com/almanac/properties/t/text-overflow/
回答2:在給a設置的時候,加上display: inline-block;
相關文章:
1. 我在centos容器里安裝docker,也就是在容器里安裝容器,報錯了?2. docker不顯示端口映射呢?3. docker-compose中volumes的問題4. 在windows下安裝docker Toolbox 啟動Docker Quickstart Terminal 失敗!5. docker內創建jenkins訪問另一個容器下的服務器問題6. golang - 用IDE看docker源碼時的小問題7. javascript - 連續點擊觸發mouseleave事件8. 關docker hub上有些鏡像的tag被標記““This image has vulnerabilities””9. docker容器呢SSH為什么連不通呢?10. mac里的docker如何命令行開啟呢?

網公網安備