Làm thế nào để liên kết CSS bên ngoài với Page - núm vú

Để liên kết một trang HTML với một Cascading Style Sheet (CSS), bạn chỉ cần chèn một dòng mã vào phần đầu của trang để tham khảo tên và vị trí của tệp CSS bên ngoài liên quan đến cấp gốc của máy chủ mà trang web đó cư trú.

Dòng mã cho liên kết phải được đặt ở đâu đó giữa các thẻ mở và đóng của mọi trang HTML trên trang web của bạn mà bạn muốn được theo kiểu với liên kết đó.

Khi tên tập tin của CSS được nhập vào chính xác trong tệp HTML sử dụng cú pháp liên kết chính xác, mã liên kết cung cấp hướng dẫn cho trình duyệt về cách thức thông tin kiểu CSS nên được diễn giải và áp dụng cho trang, do đó xác định cách trang xuất hiện trong trình duyệt.

Dưới đây là ví dụ về liên kết đến tệp CSS bên ngoài với tên tệp chính. css, nơi tập tin đang được có nguồn gốc sử dụng thuộc tính href của thẻ liên kết, là một thẻ không được bộc lộ trong HTML:

Khi mã liên kết được thêm vào trang XHTML, thẻ phải được đóng lại bằng cách thêm một khoảng trống và dấu gạch chéo trước khi kết thúc:

Các thuộc tính khác trong thẻ bên cạnh href được yêu cầu để giúp trình duyệt giải thích dữ liệu trên tệp CSS được liên kết:

• Thuộc tính rel đặt mối quan hệ giữa tài liệu gốc và tệp được liên kết và xác định tệp được liên kết dưới dạng một trang tính.

• Thuộc tính type xác định loại ngôn ngữ phong cách đang được sử dụng trong tệp được liên kết, trong trường hợp này xác định rằng tệp được liên kết được viết bằng định dạng "text / css".

Để có tính nhất quán, hãy thử đặt liên kết CSS trong các trang web của bạn ở cùng vị trí trong mã từ trang này sang trang. Ví dụ: bạn có thể muốn thêm thẻ liên kết trực tiếp sau thẻ meta cuối cùng hoặc đặt nó ngay trên thẻ đóng. Sự nhất quán có thể giúp bạn nhanh chóng tìm thấy thẻ nếu bạn cần sửa đổi.

Bên cạnh vị trí của liên kết trong các trang HTML sử dụng tệp CSS bên ngoài, bạn cũng nên chú ý đến nơi (các) tệp CSS nằm so với các tệp khác trong trang.

Thông thường, mỗi trang web chỉ có một tệp tin CSS, và tệp đó nằm ở cấp độ gốc, đó chỉ là một cách gợi ý để nói rằng tệp CSS nằm ở cùng vị trí với chỉ mục. tệp html, đó là trang chủ cho trang web của bạn.

Mức độ gốc là tầng trệt của trang web, cho dù đó là một bản sao cục bộ của trang web của bạn ngồi trên máy tính của bạn ở phía trước của bạn hoặc một bản sao của trang web nằm trên máy chủ lưu trữ từ xa. Với hầu hết các trang web, trang chủ nằm ở cấp gốc cùng với thư mục hình ảnh và tất cả các trang chính khác của trang web.

Đối với các trang web lớn hơn, một số nhà thiết kế tạo các thư mục con ở cấp cơ sở để chứa các thứ khác như tệp JavaScript bên ngoài và jQuery, tệp CSS bên ngoài, tập lệnh CGI hoặc các nhóm trang nằm trong một danh mục tương tự (ví dụ: các trang liên quan đến sản phẩm hoặc dịch vụ của công ty).

Nếu trang web của bạn yêu cầu hai hoặc nhiều Cascading Style Sheets (có thể là một cho tất cả các trang và một giây cho một số ít các trang sẽ được in), bạn sẽ có thể tạo một thư mục riêng biệt được gọi là css ở gốc mức độ của trang web và sau đó lưu các tập tin CSS bên trong nó.

Sau đó, bạn có thể truy cập mỗi CSS từ vị trí đó, với điều đó href của liên kết CSS của bạn cho thấy vị trí mới của thư mục cùng với tên tệp tin:

 href = " css / main. " rel =" stylesheet "type =" text / css ">