Làm cách nào để nhận được IE8 chấp nhận CSS: trước thẻ?

Tôi có đoạn code CSS sauLàm cách nào để nhận được IE8 chấp nhận CSS: trước thẻ?

.editable:before { 
    content: url(../images/icons/icon1.png); 
    padding-right:5px; 
}

này được sử dụng kết hợp với các đánh dấu sau:

<span class="editable"></span>

Trong mọi trình duyệt may mắn khác trong thế giới biểu tượng của tôi xuất hiện, nhưng IE8 dường như có một vấn đề với điều này. Không phải là :before CSS2 phần tử giả? không phải là content: cũng là lệnh CSS2? đưa cái gì?

Nguồn

2010-03-30 William Calleja

Tôi không biết về IE8, nhưng: trước và: sau không được hỗ trợ trong IE7 trở xuống. Không biết nếu họ cuối cùng đã thêm hỗ trợ trong 8 hay không. Nếu họ đã đảm bảo rằng trang không hiển thị trong mô phỏng IE7. – prodigitalson

Cập nhật: Tôi đã đọc sai trang! IE 8 hiện hỗ trợ: trước khi có hình ảnh, nó không hoạt động khi ở chế độ tương thích IE7.

IE8 hỗ trợ :before, ~~nhưng không phải là~~ và cũng là hình ảnh làm nội dung khi không ở chế độ tương thích. Kudos để @toscho để thử nghiệm!

Làm thế nào tôi yêu quirksmode.org, mà làm cho đối phó với công cụ này ít nhất một nửa chiều bearable. Anh chàng xứng đáng nhận được huy chương!

Nguồn

2010-03-30 15:05:52

Ah và nếu tôi nhớ chính xác, bạn không thể đặt mã html vào nó, vì vậy, sử dụng là ra ... – NibblyPig

@ SLC: Nó được hiển thị dưới dạng văn bản, vâng. – ANeves

Bạn có thể sử dụng hình ảnh làm nền cho nội dung được tạo ra:

<!DOCTYPE html> 
<meta charset="UTF-8"> 
<title>Generated content with an image</title> 
<style> 
p:before 
    { 
     content: ''; 
     padding: 20px; 
     background: url("css.png") center center no-repeat; 
    } 
</style> 
<p>Test</p>

trình trong IE 8, Opera và Mozilla. Live-Demo.

Nguồn

2010-03-30 15:34:41 fuxia

bạn đã đúng! IE8 như IE8 hỗ trợ hình ảnh như nội dung. Chúc mừng, cập nhật câu trả lời của tôi. +1. –

Thực ra bạn nên cẩn thận ở đây và đọc chi tiết. Để biết chi tiết đầy đủ, xem this link - trong đó nêu

Trong Windows Internet Explorer 8, cũng như các phiên bản sau của Windows Internet Explorer trong chế độ tiêu chuẩn IE8, chỉ có hình thức một ruột của phần tử giả này được công nhận —đó là, trước đây. Bắt đầu với Windows Internet Explorer 9, phần :: trước phần tử giả yêu cầu hai thuộc tính , mặc dù biểu mẫu một dấu hai chấm vẫn được nhận dạng và hoạt động giống hệt với dạng hai dấu hai chấm.

nghĩa cho các trình duyệt <IE9 - bạn phải sử dụng :before và cho >=IE9 - bạn phải sử dụng ::before

Nguồn

2012-04-17 13:36:42 Tim

thấy điều này đã cứu tôi một loạt thời gian, IE8 đã không làm việc cho tôi bởi vì tôi đã có :: –

đôi ruột kết là vấn đề của tôi, cảm ơn cho người đứng đầu lên. Làm thế nào để thực hiện điều này tương thích về phía trước? I E. sử dụng dấu hai chấm nếu nó ít hơn IEX so với dấu hai chấm nếu nó lớn hơn IEY? – Jacques

@Jacques dấu hai chấm đơn sẽ hoạt động tốt như trong IE> = 9. Vì vậy, bây giờ chỉ cần gắn bó với dấu hai chấm đơn (là tiêu chuẩn CSS2.1). Chỉ CSS3 phân biệt giữa các dấu hai chấm đơn và kép cho các bộ chọn giả và các phần tử giả. –

Khi sử dụng: trước và: after, chỉ cần cẩn thận không sử dụng dấu hai chấm đôi (:: sau - sẽ không làm việc, nhưng: sau khi sẽ làm việc). Tôi bị mất khoảng 20 phút cho điều này ...

Nguồn

2012-10-15 12:26:17 marinbgd

Cảm ơn bạn, đây thực sự là câu trả lời cá nhân tôi đang tìm kiếm. IE8 bây giờ là một công việc cho tôi. (IE8 ngu ngốc!) – philtune

Bạn thưa ông, đã cứu tôi khỏi một phiên gỡ lỗi có thể kéo dài cả ngày vì sao điều này & $ (* # sẽ không hoạt động trong khi mọi bảng tương thích đều nói rằng nó nên. –

nhưng tốt hơn để sử dụng :: trước đây cho các trình duyệt hiện đại chắc chắn nếu bạn có thể tăng gấp đôi lên như đóng: trước, đóng :: trước {etc ... – landed

Điều này đang tắt của ví dụ tuyệt vời của Pekka ... Chiều cao của tôi trong dự án của tôi là cao cho hàng ... Vì vậy, tôi đã thêm một padding-bottom: 0px;

Chỉ trong trường hợp bạn rơi vào điều này ....

.icon-spinner:before { 
    content: ''; 
    padding: 15px; 
    padding-bottom: 0px; 
    background: url("css.png") no-repeat left top; 
}

Nguồn

2013-09-30 15:51:04 no1uknow

Làm cách nào để nhận được IE8 chấp nhận CSS: trước thẻ?

Trả lời

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