Làm cách nào để thay đổi màu chữ trong HTML?

Trang này chứa các hướng dẫn về cách thay đổi phông chữ và màu của phông chữ trên trang web. Với sự ra đời của 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 pháp cũ, sử dụng thuộc tính kiểu 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 nữa

Ghi chú

Mặc dù các phương pháp 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

Mẹo

The methods for changing font attributes on this page work for text contained in most HTML tags, including

,

, and . These methods also work for text in a table, using the

, , and
tags.

  • Sử dụng CSS cho một ứng dụng
  • Sử dụng CSS cho một hoặc nhiều trang
  • Sử dụng thẻ phông chữ

Sử dụng CSS cho một ứng dụng

Nếu bạn định thay đổi phông chữ và màu của phông chữ cho một từ, câu hoặc đoạn vă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 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ụ

This text has the font Courier, is Blue, and 20px.

Kết quả

Văn bản này có phông chữ Courier, màu xanh da trời 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

In the head portion of your web page, you may insert code between the tabs to change the appearance of your text in various elements. The next blue box contains example code that, once called, would change your font face to Courier and color it red. As you can see, we have defined the class name as "custom."

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 gắn lớp "tùy chỉnh" cho chúng. Hộp sau hiển thị hai dòng mã và kết quả tương ứng của chúng

Ví dụ

This whole sentence is red and Courier

Only the word test is red and Courier.

Kết quả

Toàn bộ câu này là màu đỏ và Chuyển phát nhanh

Chỉ có từ kiểm tra 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 hiển thị một ví dụ để tạo tệp CSS cơ bản thay đổi phông chữ và màu sắc cho hầu hết các phần tử. Tệp 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, lưu văn bản sau dưới dạng. tệp css sẽ chuẩn bị để nhập

@charset "utf-8";
.courier { font-family: Courier; color: #005CB9; }

Sau khi văn bản trước đó được đặt vào một. css (chúng tôi đã đặt tên cho tệp cơ bản của chúng tôi. css), bạn có thể liên kết đến 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

Mẹo

Người dùng có thể thay đổi thuộc tính của các phần tử trên một trang bằng cách thay đổi mã trong phần đã nhập. tập tin css

Sử dụng thẻ phông chữ

Mặc dù không được dùng nữa, thẻ HTML vẫn có thể được sử dụng và có thể cần thiết để 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 face, thuộc tính này mô tả phông chữ sẽ được sử dụng. Trong ví dụ bên dưới, chúng tôi đang sử dụng phông chữ Courier và mã màu thập lục phân #005CB9, có màu xanh đậm

Một cách để làm cho trang web đẹp mắt hơn là thêm nền màu hoặc hình ảnh phía sau văn bản. Để thêm màu cho nền, hãy sử dụng một thuộc tính của thẻ được gọi là BGCOLOR. Hầu hết các trình duyệt mới hơn đều hiểu các màu được chỉ định bằng các từ tiếng Anh như đen, xanh, trắng, đỏ, v.v.

Đối với nền màu xanh, hãy thêm thuộc tính sau vào thẻ

Để kiểm soát màu chính xác hơn, hãy sử dụng mã thập lục phân cho 256 màu có thể được hiển thị trên trang web

Trang web có màu và mã màu là.
http. //www. Phượng Hoàng. net/~jacobson/rgb. html

Để trở về màu nền trắng, hãy sử dụng

Đừng quên bao gồm dấu # trước mã hex

đầu trang


Thay đổi màu văn bản

Để thay đổi màu của văn bản cho toàn bộ tài liệu, hãy sử dụng thẻ

Trong khoảng trống giữa các dấu ngoặc kép, hãy nhập từ màu chẳng hạn như đỏ, xanh dương, xanh lá cây, v.v. hoặc mã thập lục phân cho 256 màu có thể được hiển thị trên trang web. Đừng quên bao gồm dấu # trước mã hex

Đối với văn bản màu đỏ, hãy thêm thuộc tính sau vào mã vào thẻ

hoặc

#ff0000 là mã màu của màu đỏ

Để thay đổi một số văn bản trong tài liệu HTML sang màu khác, hãy sử dụng Thẻ FONT MÀU

Để thay đổi màu của phông chữ thành màu đỏ, hãy thêm thuộc tính sau vào mã vào thẻ

hoặc

#ff0000 là mã màu của màu đỏ

Ví dụ

Phần thân Nền Nền này có màu ĐỎ Chữ màu trắng Chữ màu vàng

Bấm vào đây để xem trang Web

đầu trang


Hinh nên

Ngoài việc có một màu đồng nhất, nền đồ họa có thể giúp trang nổi bật hơn. Xác định vị trí trong khoảng trống giữa dấu ngoặc kép tên của đồ họa sẽ được sử dụng làm hình nền

yêu cầu trình duyệt lấy đồ họa "greystars. gif" và đặt nó trên nền của trang web này

Chuyển đến trang web ví dụ hiển thị nền này

Kiểm tra trang web nền này để biết thêm hình nền miễn phí

Lưu trữ nền tảng - http. // công nghệ. mit. edu/KPT/bgs. html

đầu trang


Thay đổi màu sắc của liên kết

Liên kết chưa được truy cập

Văn bản liên kết chưa được truy cập chưa được liên kết với vị trí khác
Để thay đổi màu của liên kết chưa được truy cập, hãy sử dụng.

Tạo trang có liên kết màu xanh lam
- mã màu #00FF00 là mã màu xanh lam.

Để thay đổi màu của một liên kết chưa được truy cập, hãy thay đổi mã hex ở giữa các dấu ngoặc kép. Đừng quên bao gồm dấu # trước mã hex

Liên kết đã truy cập

Liên kết đã xem, màu của liên kết sẽ thay đổi sau khi được xem
Để thay đổi màu của liên kết Đã xem, hãy sử dụng.

Tạo trang có các liên kết đã truy cập màu tím
-mã màu #DB70DB là mã cho màu tím.

Liên kết hoạt động

Liên kết đang hoạt động màu tạm thời mà liên kết sẽ thay đổi khi được nhấp vào
Để thay đổi màu của liên kết đang hoạt động, hãy sử dụng.

Tạo trang có liên kết màu đỏ trong khi liên kết đang hoạt động
- mã màu #FF0000 là mã màu đỏ.

Ghi chú. Thao tác này sẽ thay đổi (các) màu liên kết cho toàn bộ tài liệu

Ví dụ

Dưới đây là một số liên kết có sự thay đổi màu sắc của họ

Kiểm tra trang web ví dụ

Một số mẹo sử dụng màu sắc

Hãy ghi nhớ khi sử dụng màu sắc hoặc hình ảnh trong nền của bạn là việc đọc văn bản phía trước nó sẽ dễ dàng như thế nào

Mã HTML cho văn bản màu là gì?

Mã màu HTML ở định dạng thập lục phân gồm hai chữ số cho màu đỏ, xanh dương và xanh lục (#RRBBGG) . Mã màu thập lục phân đi từ 00 đến DD. Ví dụ: #FF0000 sẽ có màu đỏ và #40E0D0 sẽ có màu ngọc lam.

Làm cách nào để thay đổi màu sắc trong HTML?

Để thay đổi màu của văn bản và nền của trang web, bạn cần bao gồm các thuộc tính bổ sung trong thẻ . Nếu trang web bạn đang tạo chứa nhiều trang, bạn có thể chỉ định các thuộc tính này cho tất cả các trang của mình trong một biểu định kiểu.