2011-08-09 28 views
21

thêm ellipsis để một câu đó là quá lâu, bạn có thể sử dụng phương pháp này: http://jsfiddle.net/ArKeu/Có thể tràn dòng văn bản theo chiều dọc với css3 không?

rằng hoạt động tuyệt vời cho độ rộng nhưng nó bằng cách nào đó có thể thêm ellipsis theo chiều dọc quá? rằng dường như không làm việc :(

http://jsfiddle.net/ArKeu/2/

không ai biết điều này, Cảm ơn bạn.

+0

Kết quả mong muốn của bạn sẽ như thế nào? – Shad

+0

về cơ bản nó cắt văn bản sau 300 pixel dọc và thêm dấu chấm lửng. Giống như trong jsfiddle đầu tiên – cmplieger

+0

Nhưng sau đó, dấu ba chấm sẽ nằm ngoài phần tử cha? – Shad

Trả lời

29

Hiện nay không có cross-browser cách CSS-chỉ để đạt được hành vi như vậy.

Bạn chỉ có thể thực hiện việc này ngay bây giờ trong các trình duyệt dựa trên webkit bằng cách sử dụng -webkit-box-webkit-line-clamp, xem http://jsfiddle.net/ArKeu/7/

+0

dude bạn thật tuyệt vời! Tôi chỉ viết mã cho safari vậy ... YAY !!! – cmplieger

+3

REALLY AWESOME! – cmplieger

+0

Bạn được chào đón :) – kizu

10

UPDATE! UPDA! TE! CẬP NHẬT!

Kể từ thời điểm tôi viết câu trả lời đó, Clamp.js dường như đã nguội và chết. Dự án vẫn tồn tại trên github để bạn có thể kiểm tra nó.

Nhưng, có một giải pháp thay thế tốt hơn tại đây: ftellipsis. Đó là trình duyệt chéo.


Tại sao trình duyệt webkit nên có tất cả những điều thú vị?

Giải pháp này ở đây rộng hơn và cung cấp hỗ trợ cho các trình duyệt khác. http://reusablebits.com/post/2642059628/introducing-clamp-js (liên kết chết)

+0

Liên kết đó đã chết, bạn có thể cung cấp thay thế không? – devshorts

Các vấn đề liên quan