Bao gồm các nhận xét trong mã CSS của bạn rất hữu ích và được khuyến khích.
Mỗi trang web được tạo thành từ các yếu tố cấu trúc (được quyết định bởi HTML) cũng như phong cách trực quan hoặc "giao diện" của trang web đó. Cascading Style Sheets (CSS) là những gì được sử dụng để dictate sự xuất hiện trực quan của một trang web. Các kiểu này được giữ riêng biệt với cấu trúc HTML để cho phép dễ dàng cập nhật và tuân thủ các tiêu chuẩn Web.
Với kích thước phức tạp của nhiều trang web hiện nay, các trang mẫu có thể nhanh chóng trở nên khá dài và rất cồng kềnh để làm việc. Điều này đặc biệt đúng khi bạn bắt đầu thêm vào các truy vấn phương tiện cho các kiểu trang web đáp ứng . Những truy vấn phương tiện truyền thông một mình có thể thêm một số lượng đáng kể các phong cách mới vào một tài liệu CSS và làm cho nó thậm chí còn khó khăn hơn để làm việc với. Đây là nơi các bình luận CSS có thể trở thành một trợ giúp vô giá trên một trang web.
Thêm nhận xét vào tệp CSS của trang web là một cách tuyệt vời để thêm cấu trúc vào các phần của mã đó cho trình đọc của người đang xem xét tài liệu. Nó cũng là một phương pháp tuyệt vời để giải thích những phong cách cho một chuyên gia web có thể phải làm việc trên trang web trong tương lai - bao gồm cả chính bạn!
Cuối cùng, các chú thích CSS được thêm thông minh sẽ làm cho một bảng định kiểu dễ xử lý hơn. Điều này thực sự quan trọng đối với các tờ định kiểu sẽ được các đội biên tập. Nhận xét có thể được sử dụng để truyền đạt các khía cạnh quan trọng của bảng định kiểu cho các thành viên khác nhau của nhóm có thể không quen với mã đã có. Những nhận xét này cũng có thể rất hữu ích cho những người đã làm việc trên trang web trước khi họ quay lại mã sau khi bị rời khỏi nó một thời gian. Tôi thường phải chỉnh sửa một trang web mà tôi đã xây dựng hàng tháng hoặc thậm chí nhiều năm trước và có những nhận xét được định dạng tốt trong HTML và CSS là sự trợ giúp rất hoan nghênh! Hãy nhớ rằng, chỉ vì bạn xây dựng một trang web không có nghĩa là bạn sẽ nhớ lý do tại sao bạn đã làm những việc bạn đã làm khi bạn quay lại trang web đó trong tương lai! Nhận xét có thể làm cho ý định của bạn rõ ràng và xóa mọi hiểu lầm trước khi chúng xảy ra.
Một điều cần hiểu về nhận xét CSS là chúng không được hiển thị khi trang hiển thị trong trình duyệt web. Những nhận xét đó chỉ mang tính thông tin, giống như bình luận HTML (mặc dù cú pháp khác nhau giữa hai chú thích). Các nhận xét CSS này không ảnh hưởng đến hiển thị trực quan của trang web theo bất kỳ cách nào và chỉ đơn giản xuất hiện trong chính mã đó.
Thêm nhận xét CSS
Việc thêm nhận xét CSS khá dễ dàng. Bạn chỉ đơn giản là bookend bình luận của bạn với các thẻ bình luận mở và đóng chính xác:
- Bắt đầu nhận xét của bạn bằng cách thêm / *
- Đóng nhận xét của bạn bằng cách thêm * /
Mọi thứ xuất hiện giữa hai thẻ này sẽ là nội dung của nhận xét, chỉ hiển thị trong mã và không được hiển thị bởi trình duyệt.
Nhận xét CSS có thể là một dòng hoặc có thể mất nhiều dòng. Dưới đây là một ví dụ dòng đơn:
div # border_red {border: mỏng màu đỏ; } / * ví dụ đường viền màu đỏ * /Và một ví dụ nhiều dòng:
/ *************************** ********************** ****** Kiểu cho văn bản mã **************************** ************ *************** /Breaking Out Section
Một trong những cách tôi thường sử dụng các nhận xét CSS là tổ chức bảng định kiểu của mình theo các đoạn nhỏ hơn, dễ dàng hơn. Tôi thích để có thể dễ dàng nhìn thấy những phần này khi tôi nghiên cứu về tệp sau này. Để làm điều này, tôi thường thêm các bình luận với rất nhiều dấu gạch ngang trong chúng để chúng cung cấp các ngắt lớn, rõ ràng trong trang dễ thấy khi tôi nhanh chóng cuộn qua mã. Đây là một ví dụ:
/ * ----------------------- Kiểu Tiêu đề ----------------------- ------- * /Khi tôi thấy một trong những nhận xét này trong mã của mình, tôi biết đó là phần bắt đầu của một phần mới của tài liệu đó, cho phép tôi dễ dàng xử lý và sử dụng mã.
& # 34; Nhận xét & # 34; Mã số
Thẻ nhận xét cũng có thể hữu ích trong quá trình mã hóa và gỡ lỗi một trang thực tế. Nhận xét có thể được sử dụng để "nhận xét" hoặc "tắt" các khu vực của mã đó để xem điều gì sẽ xảy ra nếu phần đó không phải là một phần của trang.
Vậy nó hoạt động như thế nào? Vâng, bởi vì các thẻ bình luận yêu cầu trình duyệt bỏ qua mọi thứ giữa chúng, bạn có thể sử dụng chúng để tạm thời vô hiệu hóa một số phần nhất định của mã CSS. Điều này có thể hữu ích khi gỡ lỗi hoặc khi điều chỉnh định dạng trang web.
Để thực hiện điều này, bạn chỉ cần thêm thẻ nhận xét mở nơi bạn muốn mã bắt đầu bị vô hiệu hóa và sau đó đặt thẻ kết thúc đó vào nơi bạn muốn phần bị vô hiệu hóa kết thúc. Mọi thứ giữa các thẻ đó sẽ không ảnh hưởng đến hiển thị trực quan của một trang web, cho phép bạn gỡ lỗi CSS để xem vấn đề có thể xảy ra ở đâu. Sau đó, bạn có thể truy cập và khắc phục vấn đề đó và xóa nhận xét khỏi mã.
Mẹo nhận xét CSS
Tóm lại, dưới đây là một số mẹo cần nhớ khi sử dụng nhận xét trong CSS của bạn:
- Nhận xét có thể mở rộng nhiều dòng.
- Nhận xét có thể bao gồm các phần tử CSS mà bạn không muốn hiển thị bởi trình duyệt nhưng không muốn xóa hoàn toàn. Đây là một cách hay để gỡ lỗi các trang định kiểu của trang web - chỉ cần chắc chắn xóa các kiểu không sử dụng (trái ngược với việc để lại chúng nhận xét) nếu bạn quyết định không cần chúng trên trang web
- Sử dụng nhận xét bất cứ khi nào bạn viết CSS phức tạp để thêm làm rõ và để thông báo cho các nhà phát triển tương lai, hoặc bản thân bạn trong tương lai, về những điều quan trọng họ nên biết. Điều này sẽ tiết kiệm thời gian phát triển trong tương lai cho tất cả những người liên quan.
- Nhận xét cũng có thể bao gồm thông tin meta như:
- tác giả
- Ngày tạo
- Thông tin bản quyền
Hiệu suất
Nhận xét chắc chắn có thể hữu ích, nhưng lưu ý rằng bạn càng nhận được nhiều nhận xét hơn cho một tờ định kiểu, nó sẽ trở nên hấp dẫn hơn, điều này sẽ ảnh hưởng đến tốc độ tải xuống và hiệu suất của trang web. Đây là một mối quan tâm thực sự, nhưng bạn không nên ngần ngại để thêm ý kiến hữu ích và hợp pháp vì sợ rằng hiệu suất sẽ bị ảnh hưởng. Các dòng CSS không thêm kích thước đáng kể vào tài liệu. Bạn sẽ cần phải thêm TẤN của các dòng nhận xét để tạo ra tác động đáng kể đến kích thước của tệp CSS. Việc thêm một số nhận xét hữu ích vào CSS của bạn sẽ không mang lại cho bạn tác động tiêu cực ròng đến tốc độ trang.
Cuối cùng, bạn sẽ muốn tìm sự cân bằng giữa các nhận xét hữu ích và quá nhiều nhận xét để có được những lợi ích của cả hai trong tài liệu CSS của bạn.
Bài báo gốc của Jennifer Krynin. Biên tập bởi Jeremy Girard vào 7/5/17