Thắc mắc về tiền tố -moz- , -webkit- trong thiết kế web

E có đọc 1 đoạn code trên mạng thì thấy trong file.css họ có để thêm trước các thuộc tính 2 tiền tố -moz--webkit-. Vậy họ để như thế để làm gì và 2 cái tiền tố đó có tác dụng ra sao ạ ? (mn có thể dẫn link cho e cái tutorial hoặc hướng dẫn trực tiếp bên dưới cho e luôn nhé ^^)

Và nếu website của mình dùng HTML5 + CSS3 thì 1 số thuộc tính các browser cũ (đặc biệt là thằng IE) nó không hiển thị hay support thì phải làm sao ạ ?

Em thanks các pro nhiều :smiley:

1 Like

Một câu hỏi y hệt của bạn trên SO nè: http://stackoverflow.com/questions/18083056/css-what-are-moz-and-webkit?answertab=votes#tab-top

Ý chính là như vầy: Đây là những tiền tố được cung cấp bởi các engine render khác nhau:

  1. -webkit là của Chrome và Safari
  2. -moz là của Firefox
  3. -o là của Opera
  4. -ms là của Internet Explorer
    Những tiền tố này giúp render ra những tính năng CSS mới.(chi tiết hơn thì bạn xem nội dung của link nhé)
6 Likes

Khi CSS3 mới ra thì mỗi trình duyệt hỗ trợ mỗi khác, có cái thằng này có, thằng kia lại không. Thằng nào hỗ trợ thuộc tính nào thì thêm prefix của nó vào trước, trình duyệt khác sẽ xem đó là một property sai và bỏ qua.
Còn bây giờ, thì hầu hết trình duyệt đều hỗ trợ đầy đủ CSS3 cả rồi, nên không cần thêm tiền tố vào cũng được.

Muốn tra cứu kỹ càng hơn thì truy cập caniuse.

Cách nhanh nhất và dễ dàng nhất là viết CSS không prefix, sau đó dùng autoprefixer, nó sẽ tự thêm những prefix còn thiếu vào.

Để hỗ trợ HTML5 cho trình duyệt cũ thì nhúng thêm html5shiv vào mã nguồn.

Còn nhiều thủ thuật khác, bạn có thể xem trên browserhacks.

3 Likes

Sao e gõ box-sizing:border-box; vào cái khung bên trái thì nó không translate sang cái khung bên phải nhỉ :smile:

E cảm ơn 2 người nhiều nhé :thumbsup:

Phải đúng cú pháp, có selector nữa

.example {
    box-sizing:border-box;
}
1 Like

Em gõ đúng mà nó có ra đâu anh :smiley:

Ra rồi đấy, điều đó có nghĩa là bạn không cần thêm prefix cho property này, vì phần lớn trình duyệt đã hỗ trợ cả rồi.

6 Likes
83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?