Trang này chứa các hướng dẫn về cách thay đổi phông chữ và màu sắc của nó trên trang web. Với việc giới thiệu HTML5, cách thích hợp để định cấu hình phông chữ trang web là sử dụng Cascading Style Sheets. Phương thức cũ, sử dụng thuộc tính kiểu thẻ nội tuyến hoặc thẻ phông chữ, không được dùng nữa và không còn được sử dụng.
Ghi chú
Mặc dù các phương thức không dùng nữa vẫn có thể hiển thị chính xác trong các trình duyệt Internet hiện đại, nhưng chúng không còn được đảm bảo để làm như vậy. Để tạo các trang web hiển thị chính xác cho số lượng người dùng tối đa, hãy sử dụng các phương pháp CSS được mô tả trên trang này.
Ghi chú
Nếu bạn đang tìm kiếm trợ giúp để tùy chỉnh giao diện phông chữ trong tài liệu Microsoft Word, hãy xem cách thay đổi màu phông chữ, kích thước hoặc nhập trong Word.
Sử dụng CSS cho một ứng dụng
Nếu bạn dự định thay đổi mặt phông chữ và màu của nó chỉ một lần trên trang web, hãy định cấu hình các thuộc tính của nó trong thẻ phần tử. Sử dụng thuộc tính style, bạn có thể chỉ định mặt và màu của phông chữ với họ phông chữ, màu sắc và kích thước phông chữ với cỡ chữ, như trong ví dụ bên dưới.
Mã ví dụ
Văn bản này có phông chữ Courier, là Blue và 20px.
Kết quả
Văn bản này có phông chữ Chuyển phát nhanh, có màu Xanh lam và kích thước 20px.
Sử dụng CSS cho một hoặc nhiều trang
Phông chữ tùy chỉnh cho một trang
Trong phần đầu của trang web của bạn, bạn có thể chèn mã giữa các thetab để thay đổi giao diện của văn bản trong các yếu tố khác nhau. Hộp màu xanh tiếp theo chứa mã ví dụ, một khi được gọi, sẽ thay đổi mặt phông chữ của bạn thành Chuyển phát nhanh và tô màu đỏ. Như bạn có thể thấy, chúng tôi đã định nghĩa tên lớp là "tùy chỉnh".
.custom {font-family: Courier; color: red; font-size: 20px; }
Sau khi được xác định, kiểu dáng này có thể được áp dụng cho hầu hết các thành phần trong trang của bạn bằng cách đính kèm lớp "tùy chỉnh" cho chúng. Hộp sau đây cho thấy hai dòng mã và kết quả tương ứng của chúng.
Thí dụ
Toàn bộ câu này là màu đỏ và Chuyển phát nhanh
Chỉ có bài kiểm tra từ là màu đỏ và Chuyển phát nhanh.
Kết quả
Toàn bộ câu này là màu đỏ và Chuyển phát nhanh.
Chỉ có bài kiểm tra từ là màu đỏ và Chuyển phát nhanh.
Phông chữ tùy chỉnh cho nhiều trang
Nhập tệp CSS bên ngoài có thể rất có lợi ở chỗ nó cho phép người dùng thay đổi quy tắc cho nhiều trang cùng một lúc. Phần sau đây cho thấy một ví dụ để tạo một tệp CSS cơ bản thay đổi phông chữ và màu của nó cho hầu hết các yếu tố. Tập tin này có thể được tải vào nhiều trang web, thậm chí toàn bộ trang web.
Sử dụng bất kỳ trình soạn thảo văn bản cơ bản nào, việc lưu văn bản sau dưới dạng tệp.css sẽ chuẩn bị cho việc nhập.
@charset "utf-8";
.courier {font-family: Courier; color: # 005CB9; }
Khi văn bản trước được đặt vào tệp.css (chúng tôi đã đặt tên cho basic.css của chúng tôi), bạn có thể liên kết với nó từ bất kỳ trang nào khác bằng cách sử dụng một dòng tương tự như ví dụ sau.
tiền boa
Người dùng có thể thay đổi các thuộc tính của các thành phần trên một trang bằng cách thay đổi mã trong tệp.css đã nhập.
Giải pháp thẻ phông chữ
Mặc dù không được dùng nữa, HTMLtag vẫn có thể được sử dụng và có thể cần được sử dụng với một số dịch vụ trực tuyến. Khi sử dụng thẻ FONT, bạn phải bao gồm thuộc tính khuôn mặt, mô tả phông chữ sẽ được sử dụng. Trong ví dụ dưới đây, chúng tôi đang sử dụng phông chữ Chuyển phát nhanh và mã màu thập lục phân # 005CB9 , có màu xanh đậm.
Mã ví dụ
Một ví dụ phông chữ đặc biệt.