Biểu định kiểu bên ngoài là một tệp riêng biệt được liên kết với trang web HTML. Nó đi kèm với một. phần mở rộng tên tệp css. Tất cả các kiểu cần sử dụng trên trang web đều có thể được khai báo trong biểu định kiểu bên ngoài. Biểu định kiểu bên ngoài là một công cụ quan trọng theo quan điểm của quản trị viên web
Quảng cáo
Techopedia giải thích biểu định kiểu bên ngoài
By applying consistent formatting to website pages, external style sheets help in bringing a uniform, global look and feel to a website. The external style sheet can be linked from HTML pages. When using an external style sheet, styles need to be set up only once for each element. The external style sheet contains only CSS syntax and also carries a “text/CSS” MIME type. One of the unique features associated with external style sheets is that they can be created in any text editor, but need to be saved with a .css extension. The file should never have any elements of HTML. There are two main techniques of calling an external style sheet into an HTML document. One method is by using the tag within the HTML document head. Another method is with the help of a combination of external CSS functions along with embedded CSS.
Có những lợi ích liên quan đến biểu định kiểu bên ngoài. Biểu định kiểu bên ngoài có thể được áp dụng cho số lượng trang web không giới hạn. Một biểu định kiểu bên ngoài có thể được áp dụng ngay lập tức để áp dụng giao diện cho từng trang web. Họ cũng có thể giúp mang lại định dạng thống nhất cho mọi trang mà họ đính kèm.
Trong hướng dẫn này, tôi muốn xem xét một số lý do tại sao bạn nên sử dụng Biểu định kiểu bên ngoài chứ không phải các định nghĩa dựa trên thẻ kiểu hoặc nội tuyến
Hướng dẫn dành cho những người học kiến thức cơ bản về CSS và tìm kiếm ý tưởng về các phương pháp hay
- Cascading Style Sheets
- Sử dụng Biểu định kiểu bên ngoài
- Sử dụng kiểu nội tuyến
- Sử dụng thẻ STYLE
Cascading Style Sheets
Cascading Style Sheets khá đơn giản là một viên ngọc quý trong quá trình phát triển web. Tuy nhiên, để tận dụng tối đa chúng, chúng cần được sử dụng đúng cách. Cho đến gần đây, mã nguồn và đánh dấu chung của một tài liệu HTML dường như là điều cuối cùng trong tâm trí của một số nhà phát triển web. Có vẻ như tất cả những gì họ quan tâm là nó trông đẹp trong bowser chứ không phải dưới mui xe. Kết quả là trang web cồng kềnh và chứa đầy đánh dấu không xác định chính xác nội dung của nó
May mắn thay, giờ đây chúng tôi dường như đã xoay chuyển được một góc và hầu hết mọi người đang tiến tới mục tiêu và tìm cách cải thiện việc đánh dấu các trang web của họ và nội dung của nó. Một trong những cách rõ ràng nhất mà mọi người đang làm là kết hợp HTML/XHTML và CSS và sử dụng chúng theo cách mà chúng được dự định.
Trong khi HTML xác định mối quan hệ của nội dung trang thì CSS xác định cách trình bày của nó. Giữ cái này tách biệt với cái kia giúp mã sạch hơn, nhẹ hơn và dễ bảo trì hơn trong tương lai. Các phần sau đây xem xét ba cách chính để tham khảo kiểu trang của bạn và lý do ủng hộ và phản đối việc sử dụng đó
ĐỨNG ĐẦU
Sử dụng Biểu định kiểu bên ngoài
Biểu định kiểu bên ngoài cho phép bạn tách hoàn toàn CSS khỏi HTML của mình. Ở đây, kiểu được bao gồm trong một hoặc nhiều tệp css và tham chiếu từ HTML của bạn bằng thẻ LINK
Thuộc tính biểu định kiểu thẻ liên kết
Thẻ liên kết có các thuộc tính sau
- rel – mối quan hệ của liên kết đến tài liệu
- href – trong trường hợp này là vị trí của biểu định kiểu được đưa vào
- type – loại tệp [trong trường hợp của chúng tôi là text/css]
- phương tiện – đối với phương tiện nào, biểu định kiểu sẽ được đưa vào
- màn hình – trình duyệt máy tính bình thường – trên màn hình
- in – trên giấy [thân thiện với máy in]
- âm thanh – cho bộ tổng hợp giọng nói
- dập nổi – dành cho máy in chữ nổi
- tất cả – dành cho tất cả các loại phương tiện truyền thông
Những lợi ích của việc sử dụng một biểu định kiểu bên ngoài là
- mọi thứ được lưu trữ trong một tệp duy nhất
- sau khi thay đổi/cập nhật, các thay đổi được phản ánh trên tất cả các trang khác tham chiếu biểu định kiểu
- điều này giúp duy trì các trang web lớn hơn dễ dàng hơn
- các trang tải nhanh hơn sau khi tệp CSS chính đã được lưu vào bộ đệm
- kết quả là băng thông giảm xuống
- một cách hiệu quả, bạn có thể thay đổi toàn bộ giao diện của một trang web thông qua một tệp duy nhất
ĐỨNG ĐẦU
Sử dụng kiểu nội tuyến
Lời khuyên của tôi là tránh sử dụng các định nghĩa kiểu nội tuyến – chúng làm phình to mã của bạn và là cơn ác mộng nếu bạn phải cập nhật nếu bạn có nhiều định nghĩa kiểu đó
Tuy nhiên, đôi khi việc sử dụng các kiểu CSS nội tuyến dễ dàng hơn
- Khi bạn cần một sự thay đổi nhanh chóng và đột xuất
- Để ghi đè biểu định kiểu chính
- Khi bạn không có quyền truy cập vào biểu định kiểu chính e. g. sử dụng CMS [Hệ thống quản lý nội dung]
ĐỨNG ĐẦU
Sử dụng thẻ STYLE
Thẻ kiểu được đặt trong thẻ đầu của trang và chỉ nhằm mục đích sửa đổi kiểu của trang bao gồm nó. Nó trông giống như thế này
body{ font-size:20px; }
Đây có lẽ là điểm giữa giữa phong cách bên ngoài và nội tuyến. Giống như các định nghĩa nội tuyến, thẻ kiểu rất tốt khi bạn cần thay đổi một tài liệu nhưng lời khuyên của tôi là chỉ sử dụng nó khi bạn cần. Nếu bạn có quyền truy cập vào biểu định kiểu bên ngoài và nếu các trang khác cũng sẽ sử dụng cùng một kiểu – CẬP NHẬT BÊN NGOÀI
Một thời điểm tốt khác để sử dụng điều này là khi bạn chỉ phải tạo một trang độc lập. Không có ích gì khi tạo một tệp mới chỉ cho một tệp vì vậy thẻ STYLE là lý tưởng