tôi đang tìm kiếm một giải pháp văn bản đột quỵ qua trình duyệt mà làm việc khi chồng trên hình ảnh nền. nghĩ rằng tôi có một giải pháp cho điều này mà không liên quan đến đánh dấu thêm, js và các công trình trong IE7-9 (tôi đã không được thử nghiệm 6), và không gây ra vấn đề răng cưa.
Đây là sự kết hợp của việc sử dụng bóng văn bản CSS3, which has good support except IE, sau đó sử dụng kết hợp bộ lọc cho IE. CSS3 hỗ trợ văn bản đột quỵ là người nghèo vào lúc này.
lọc IE:
Ánh lọc looks terrible, vì vậy tôi đã không sử dụng đó.
David Hewitt's answer liên quan đến việc thêm bộ lọc dropshadow theo kết hợp chỉ đường. Sau đó, ClearType sẽ bị xóa do đó chúng tôi kết thúc với văn bản được đánh dấu sai.
Sau đó, tôi kết hợp một số thành phần được đề xuất trên useragentman với các bộ lọc đổ xuống.
Đưa nó cùng
Ví dụ này sẽ là văn bản màu đen với một cơn đột quỵ trắng. Tôi đang sử dụng các lớp HTML có điều kiện bằng cách nhắm mục tiêu đến IE (http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/).
#myelement {
color: #000000;
text-shadow:
-1px -1px 0 #ffffff,
1px -1px 0 #ffffff,
-1px 1px 0 #ffffff,
1px 1px 0 #ffffff;
}
html.ie7 #myelement,
html.ie8 #myelement,
html.ie9 #myelement {
background-color: white;
filter: progid:DXImageTransform.Microsoft.Chroma(color='white') progid:DXImageTransform.Microsoft.Alpha(opacity=100) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=1,offY=1) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=-1,offY=1) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=1,offY=-1) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=-1,offY=-1);
zoom: 1;
}
Cảm ơn, dường như không có cách nào dễ dàng để đạt được một cái bóng mịn trong IE, rõ ràng IE v10 có text-shadow :) –