2012-01-03 49 views
37

Tôi đã xem các tệp CSS cho nhiều trang web như Facebook và Youtube."*" có nghĩa là gì trong CSS?

Trong hầu hết trong số họ tôi thấy mã này:

* { 
margin: 0; 
padding: 0; 
} 

Nó là số lẻ, như loại bỏ mà khối trong chrome công cụ phát triển web không ảnh hưởng đến bố cục của trang.

Mã này có nghĩa là gì và khi nào nó được sử dụng và tại sao?

+0

Có thể nó xuất hiện vì CSS được tạo. Nó có thể chỉ đặt lề và lề mặc định. –

+4

bạn có thể muốn xem qua câu hỏi này [Đặt lại CSS có cần thiết không?] (Http://stackoverflow.com/questions/3739154/is-a-css-reset-still-necessary) –

Trả lời

54

Đây là một kỹ thuật phổ biến được gọi là reset CSS. Các trình duyệt khác nhau sử dụng các lề mặc định khác nhau, khiến các trang web trông khác nhau theo lề. * có nghĩa là "tất cả các phần tử" (một universal selector), vì vậy chúng tôi đang thiết lập tất cả các phần tử có lề bằng 0 và không đệm, do đó làm cho chúng trông giống nhau trong tất cả các trình duyệt.

+0

Hãy thử liên kết sau: https://www.w3schools.com/cssref/sel_all.asp – Kuhan

2

Đó là ký tự đại diện và đặt marginpadding đến 0 cho tất cả các phần tử HTML.

Hãy thử một thú vị hơn như:

* { 
    font-size: 20pt; 
} 
8

* là một ký tự đại diện

Nó có nghĩa là áp dụng các kiểu đó cho tất cả các yếu tố.

Trong trường hợp này, thiết lập của nó là marginpadding trên tất cả các thành phần là 0. Điều này là phổ biến với các tệp CSS Đặt lại để mặc định tất cả các lề/đệm trình duyệt gốc trên các phần tử khác nhau thành một giá trị chung.

7

Dấu hoa thị (*) là ký tự đại diện và có nghĩa là tất cả các phần tử.

* { 
    margin: 0; 
} 

đặt lề của tất cả các yếu tố để 0.

2

Nó reset margin và padding của tất cả các yếu tố HTML trên trang để 0.

Một số trình duyệt có thể đã làm điều này theo mặc định, nhưng nó luôn luôn hữu ích để cố gắng thiết lập lại tất cả mọi thứ bằng tay, chỉ trong trường hợp.

Thực tế, nhiều trang web mang một tệp reset.css (hoặc tương tự) khi được mở, bạn sẽ nhận thấy nhiều quy tắc đặt lại mọi thứ trên mọi trình duyệt.

+0

Trình duyệt không thực hiện điều này theo mặc định, vì nó sẽ làm cho nội dung HTML không đọc được. bạn có bất kì ví dụ nào không? –

+0

Tôi không thể cung cấp bất kỳ ví dụ nào ... nhưng tôi biết có bao nhiêu trình duyệt khác nhau, các dự án, trình duyệt trên điện thoại di động, v.v. "May" là từ vàng ở đó :) – Oomta

1

Đây là một phần chung của việc đặt lại css chung. Điều này về cơ bản thiết lập tất cả các lề và padding của tất cả (*) các yếu tố để 0. Sau đó bạn được tự do để thêm của riêng bạn margin và padding giá trị cho mỗi yếu tố theo yêu cầu của bạn.

1

Trong CSS, có một số kiểu mặc định được áp dụng cho mọi trang web ngoài kiểu của bạn. Các kiểu mặc định này xác định các giá trị paddingmargin nhất định cho các thành phần như <h1>, <li>, <p>, <table>, v.v. Điều gây phiền nhiễu là bạn thường phải ghi đè các kiểu này để trang của bạn trông chính xác, nhưng không phải tất cả nhà sản xuất trình duyệt đều đồng ý. Thông thường, hầu hết các nhà phát triển thấy dễ nhất là đặt lại tất cả paddingmargins thành zero để mọi thứ hoạt động như mong đợi. * là bộ chọn wildcard và sẽ khớp với tất cả các loại phần tử. Về cơ bản, phong cách nói để thiết lập lại tất cả các padding/lề thành 0 cho tất cả các phần tử do đó loại bỏ mọi kiểu mặc định.

1

* là một thẻ hoang dã, nó sẽ chọn tất cả các yếu tố margin: 0;padding: 0; thiết lập margin và padding để 0 cho các yếu tố được lựa chọn, mà trong trường hợp này sẽ là tất cả các yếu tố.

Điều này rất thuận tiện cho việc phát triển web, tôi sử dụng nó trong mọi trang web tôi xây dựng.

+3

Điều đáng nói là nó là một kỹ thuật xứng đáng với cuộc tranh luận. Nhiều người khuyên không nên sử dụng bộ chọn thẻ hoang dã để đặt lại. Nhưng nhiều người cũng tranh luận chống lại reset nói chung. Đủ để nói, đó là một điều ưu tiên hơn là một thực hành tốt nhất chung. –