Làm cách nào để thay đổi màu của văn bản trong CSS?
|
CSS cho phép bạn kiểm soát hình thức của văn bản trên các trang web mà bạn xây dựng và quản lý. Trong hướng dẫn này, chúng tôi chỉ cho bạn cách thay đổi màu phông chữ trong CSS bằng cách sử dụng từ khóa màu, mã màu thập lục phân hoặc số màu RGB Show
Cách sử dụng kiểu CSS để thay đổi màu phông chữCác giá trị màu có thể được biểu thị dưới dạng từ khóa màu, số màu thập lục phân hoặc số màu RGB. Đối với bài học này, bạn sẽ cần có một tài liệu HTML để xem các thay đổi CSS và một tệp CSS riêng được đính kèm với tài liệu đó. Chúng ta sẽ xem xét yếu tố đoạn văn, cụ thể là Sử dụng từ khóa màu để thay đổi màu phông chữĐể thay đổi màu văn bản cho mọi đoạn trong tệp HTML của bạn, hãy chuyển đến biểu định kiểu bên ngoài và nhập p { }. Đặt thuộc tính màu theo kiểu theo sau là dấu hai chấm, như p { color. }. Sau đó, thêm giá trị màu của bạn sau thuộc tính, kết thúc bằng dấu chấm phẩy. Trong ví dụ này, đoạn văn bản được thay đổi thành màu đen p {  Sử dụng giá trị thập lục phân để thay đổi màu phông chữSử dụng từ khóa màu để thay đổi văn bản thành màu đỏ, lục, lam hoặc một số màu cơ bản khác sẽ không mang lại cho bạn độ chính xác mà bạn có thể tìm kiếm khi tạo các sắc thái khác nhau của những màu đó. Đó là giá trị thập lục phân dành cho Kiểu CSS này có thể được sử dụng để tô màu đen cho đoạn văn của bạn vì mã hex #000000 chuyển thành màu đen. Bạn thậm chí có thể sử dụng tốc ký với giá trị hex đó và viết nó là #000 với kết quả tương tự p { Các giá trị hex hoạt động tốt khi bạn cần một màu không chỉ đơn giản là đen hoặc trắng. Ví dụ: mã hex này cung cấp cho bạn khả năng thiết lập một sắc thái rất cụ thể của màu xanh—một màu xanh tầm trung, giống như đá phiến p { Hex hoạt động bằng cách đặt các giá trị RGB (đỏ, lục, lam) của một màu riêng biệt với các giá trị mười sáu cơ sở. Đó là lý do tại sao chúng chứa các chữ cái từ A đến F ngoài các chữ số từ 0 đến 9 Mỗi màu, đỏ, lục và lam, nhận giá trị hai chữ số của riêng nó. 00 là giá trị thấp nhất có thể, trong khi FF là giá trị cao nhất. Các màu được liệt kê theo thứ tự RGB trong một hình lục giác, vì vậy hai chữ số đầu tiên biểu thị giá trị màu đỏ, v.v. Sử dụng các giá trị màu RGBA để thay đổi màu phông chữCuối cùng, bạn có thể sử dụng các giá trị màu RGBA để chỉnh sửa màu phông chữ. RGCA được hỗ trợ trong tất cả các trình duyệt hiện đại, vì vậy bạn có thể yên tâm sử dụng các giá trị này rằng nó sẽ hoạt động với hầu hết người xem, nhưng bạn cũng có thể đặt dự phòng dễ dàng Giá trị RGBA này giống với màu xanh lam được chỉ định ở trên p { Ba giá trị đầu tiên đặt các giá trị Đỏ, Xanh lục và Xanh lam và số cuối cùng là cài đặt alpha cho độ trong suốt. Cài đặt alpha được đặt thành 1 có nghĩa là 100 phần trăm, vì vậy màu này không có độ trong suốt. Nếu bạn đặt giá trị đó thành số thập phân, như. 85, nó chuyển thành độ mờ 85 phần trăm và màu sẽ hơi trong suốt Nếu bạn muốn chống đạn cho các giá trị màu của mình, hãy sao chép mã CSS này p { Cú pháp này đặt mã hex trước rồi ghi đè giá trị đó bằng số RGBA. Điều này có nghĩa là bất kỳ trình duyệt cũ nào không hỗ trợ RGBA sẽ nhận giá trị đầu tiên và bỏ qua giá trị thứ hai Điều quan trọng cần lưu ý là thuộc tính màu hoạt động trên mọi thành phần văn bản HTML trong CSS. Ví dụ: bạn có thể thay đổi tất cả các màu liên kết của mình. Ví dụ này sẽ làm cho các liên kết của bạn có màu xanh sáng a { Điều này cũng hoạt động với nhiều yếu tố cùng một lúc. Bạn có thể đặt đồng thời mọi cấp độ tiêu đề. Ví dụ: điều này sẽ đặt tất cả các thành phần tiêu đề của bạn thành màu xanh nửa đêm h1, h2, h3, h4, h5, h6 { Tìm ra các giá trị hex hoặc RGBA cho màu sắc của bạn không phải lúc nào cũng dễ dàng. Hầu hết các nhà thiết kế web sẽ sử dụng chương trình chỉnh sửa hình ảnh, như Photoshop hoặc GIMP, để tạo mã chính xác. Bạn cũng có thể tìm thấy các công cụ chọn màu thuận tiện trên mạng, chẳng hạn như công cụ này từ w3schools Các cách khác để tạo kiểu trang HTMLMàu phông chữ có thể được thay đổi bằng biểu định kiểu bên ngoài, biểu định kiểu bên trong hoặc kiểu nội tuyến trong tài liệu HTML. Tuy nhiên, các phương pháp hay nhất chỉ ra rằng bạn nên sử dụng biểu định kiểu bên ngoài cho các kiểu CSS của mình Biểu định kiểu nội bộ, là các kiểu được viết trực tiếp trong "phần đầu" của tài liệu của bạn, thường chỉ được sử dụng cho các trang web nhỏ, một trang. Nên tránh các kiểu nội tuyến vì chúng giống với các thẻ "phông chữ" cũ mà chúng tôi đã xử lý nhiều năm trước. Các kiểu nội tuyến đó khiến việc quản lý kiểu phông chữ trở nên rất khó khăn vì bạn phải thay đổi chúng ở mọi phiên bản của kiểu nội tuyến Trích dẫn bài viết này Định dạng trích dẫn của bạn Kyrnin, Jennifer. "Cách thay đổi màu phông chữ trang web bằng CSS. "ThinkCo. https. //www. suy nghĩ. com/change-font-color-with-css-3466754 (truy cập ngày 30 tháng 12 năm 2022) Phong cách nào sẽ thay đổi màu sắc của văn bản CSS?Trong HTML, chúng ta có thể thay đổi màu của bất kỳ văn bản nào bằng các cách khác nhau sau đây. Sử dụng thẻ HTML. Sử dụng thuộc tính kiểu nội tuyến. Sử dụng CSS nội bộ .
Làm cách nào để thay đổi màu văn bản HTML?
. Để 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ẻ . #ff0000 là mã màu của màu đỏ. use the FONT COLOR Tag. To change the color of the font to red add the following attribute to the code to the tag. #ff0000 is the color code for red. |
