Cascading Style Sheets, được gọi thân mật là CSS, là một ngôn ngữ thiết kế đơn giản nhằm đơn giản hóa quá trình làm cho các trang web có thể hiển thị được Show
CSS xử lý phần giao diện của trang web. Sử dụng CSS, bạn có thể kiểm soát màu sắc của văn bản, kiểu phông chữ, khoảng cách giữa các đoạn văn, kích thước và bố cục của các cột, hình nền hoặc màu sắc được sử dụng, thiết kế bố cục, các biến thể hiển thị cho các thiết bị và kích thước màn hình khác nhau CSS dễ học và dễ hiểu nhưng nó cung cấp khả năng kiểm soát mạnh mẽ đối với việc trình bày tài liệu HTML. Thông thường nhất, CSS được kết hợp với ngôn ngữ đánh dấu HTML hoặc XHTML Ưu điểm của CSS
Ai tạo và duy trì CSS?CSS được tạo và duy trì thông qua một nhóm người trong W3C được gọi là Nhóm làm việc CSS. Nhóm làm việc CSS tạo tài liệu có tên là thông số kỹ thuật. Khi một thông số kỹ thuật đã được thảo luận và phê chuẩn chính thức bởi các thành viên W3C, nó sẽ trở thành một khuyến nghị Các thông số kỹ thuật đã được phê chuẩn này được gọi là các khuyến nghị vì W3C không có quyền kiểm soát đối với việc triển khai thực tế của ngôn ngữ. Các công ty và tổ chức độc lập tạo ra phần mềm đó LƯU Ý – World Wide Web Consortium, hay W3C là một nhóm đưa ra các đề xuất về cách thức hoạt động của Internet và cách thức phát triển của nó Phiên bản CSSCascading Style Sheets cấp 1 (CSS1) được W3C đưa ra như một khuyến nghị vào tháng 12 năm 1996. Phiên bản này mô tả ngôn ngữ CSS cũng như mô hình định dạng trực quan đơn giản cho tất cả các thẻ HTML CSS2 đã trở thành đề xuất của W3C vào tháng 5 năm 1998 và được xây dựng trên CSS1. Phiên bản này thêm hỗ trợ cho biểu định kiểu phương tiện cụ thể e. g. máy in và thiết bị âm thanh, phông chữ có thể tải xuống, định vị phần tử và bảng Biểu định kiểu xếp tầng (CSS) là ngôn ngữ phát triển web của thập niên 90 để tạo kiểu cho tài liệu web. Tìm hiểu cách CSS hoạt động với HTML Chiradeep BasuMallick Người viết kỹ thuật Ngày 7 tháng 11 năm 2022 Biểu định kiểu xếp tầng (CSS) được định nghĩa là ngôn ngữ biểu định kiểu được phát triển vào những năm 1990 để hỗ trợ tạo kiểu cho tài liệu web, hiện là một kỹ năng cần thiết cho các nhà phát triển web và là một trong những trụ cột chính của trải nghiệm người dùng internet hoạt động cùng với . Bài viết này giải thích các loại và cách hoạt động của CSS cũng như 20 thuộc tính hàng đầu của nó mà bạn cần biết. Mục lụcCSS là gì?Biểu định kiểu xếp tầng (CSS) được định nghĩa là ngôn ngữ biểu định kiểu được phát triển vào những năm 1990 để hỗ trợ tạo kiểu cho tài liệu web, hiện là một kỹ năng cần thiết cho các nhà phát triển web và là một trong những trụ cột chính của trải nghiệm người dùng internet hoạt động cùng với . Mô tả bằng hình ảnh về cách thức hoạt động của CSS. Nguồn Mở một cửa sổ mới CSS là ngôn ngữ lập trình biểu định kiểu giúp định cấu hình và quản lý giao diện cũng như định dạng của tài liệu được tạo bằng ngôn ngữ đánh dấu. Nó cung cấp cho HTML (Ngôn ngữ đánh dấu siêu văn bản) một tính năng bổ sung. Nó thường được kết hợp với HTML để sửa đổi giao diện của các trang web và giao diện người dùng. Năm 1996, W3C (the World Wide Web Consortium) tạo ra CSS với mục đích rõ ràng. Các thẻ hỗ trợ định dạng trang không dành cho các phần tử HTML. Mặc dù CSS không bắt buộc phải có, nhưng bạn sẽ không muốn truy cập một trang web chỉ chứa các thành phần HTML vì nó có vẻ khá đơn giản. Vì lý do này, kiểu CSS có một số thành phần 1. Bộ chọnBộ chọn xác định chính xác các thành phần HTML trên các trang web cần tạo kiểu. Các phần tử HTML mà một người nên chọn để có các giá trị thuộc tính CSS trong quy tắc được áp dụng cho chúng được chỉ định bởi một mẫu thuật ngữ và các phần tử khác được gọi là bộ chọn CSS. Bộ chọn bao gồm
2. Của cảiCác kiểu được sử dụng trên các bộ chọn cụ thể là các thuộc tính CSS. Nó hoạt động tương tự như các thuộc tính như màu nền, cỡ chữ, vị trí, v.v. Bộ quy tắc CSS đặt chúng trước các giá trị và dấu hai chấm tách chúng khỏi các giá trị thuộc tính. Có một số thuộc tính cho các bộ chọn và phần tử HTML khác nhau Một số thuộc tính có thể được áp dụng cho bất kỳ bộ chọn nào và phổ biến. Những người khác chỉ hoạt động trong một số tình huống nhất định và trên các bộ chọn cụ thể. Lưới-mẫu-cột, được sử dụng để định kiểu bố cục trang, là một ví dụ. Nó chủ yếu hoạt động với các div với thuộc tính hiển thị dạng lưới (chúng ta sẽ xem xét các thuộc tính chính của CSS ở phần sau của bài viết). Bộ chọn HTML cũng có nhiều đặc điểm và giá trị tương ứng của chúng 3. giá trịCác giá trị được gán cho các thuộc tính xác định các thuộc tính đó. Trong CSS, giá trị văn bản là phổ biến. Ngược lại với chuỗi, chúng thường được viết mà không có dấu ngoặc kép. Ngoài văn bản, các giá trị CSS cũng có thể ở dạng URL, thước đo, số, v.v. Các thuộc tính CSS cụ thể cho phép định nghĩa số nguyên cho các giá trị của chúng, bao gồm cả số âm Người ta có thể biểu thị các giá trị CSS trong các đơn vị thuộc tính cụ thể khác nhau, nhưng các đơn vị tiêu chuẩn bao gồm px, em, fr và tỷ lệ phần trăm. Các giá trị CSS có thể có một số giá trị và có thể được sử dụng để tạo tốc ký bằng cách thao tác với chúng. Các thuộc tính như hình nền yêu cầu một URL thực tế làm giá trị của chúng Xem thêm. Bluetooth LE là gì? CSS hoạt động như thế nào?Kết hợp thông tin HTML và kiểu CSS xảy ra trong hai giai đoạn sau khi tải và phân tích cú pháp. Đầu tiên, trình duyệt biến chúng thành Mô hình đối tượng tài liệu (DOM). Trình duyệt sẽ hiển thị nội dung ngay khi DOM, một đại diện của trang được lưu trữ trong bộ nhớ của máy tính, kết hợp nội dung và kiểu của tài liệu Nó đặt mã vào DOM sau khi phân tích cú pháp tài liệu HTML. Nó mô tả trang web hoàn chỉnh, bao gồm anh chị em, cha mẹ và con cái. Khi phân tích cú pháp, nó sẽ chia các liên kết tiêu đề chứa các tệp CSS. Các tệp CSS được tải trong giai đoạn tiếp theo sau khi được chia nhỏ. Quá trình phân tích cú pháp CSS diễn ra sau khi các tệp CSS đã được tải; Việc xử lý các tệp CSS phức tạp hơn một chút và bao gồm hai quy trình. Giai đoạn đầu tiên, thường là xếp tầng, giải quyết xung đột giữa các khai báo CSS. Kết hợp nhiều tệp CSS trong khi giải quyết các vấn đề như sự không nhất quán giữa các quy tắc và khai báo khác nhau được áp dụng cho cùng một phần tử là những gì nó đòi hỏi. Việc xử lý các giá trị CSS cuối cùng là giai đoạn thứ hai Xem thêm. GNSS (Hệ thống vệ tinh dẫn đường toàn cầu) là gì? Top 5 phần mềm CSSĐể sử dụng CSS hiệu quả, bạn cần biết một số phần mềm CSS phổ biến đang được sử dụng
Có đáng để được chứng nhận CSS không?Trong một thị trường ngày càng trở nên cạnh tranh, các chứng chỉ là điều cần thiết để thiết lập uy tín và chứng minh năng lực. Hai công nghệ chính mà người ta có thể sử dụng để xây dựng các trang web là CSS và HTML và W3School cung cấp một trong những chứng chỉ CSS trực tuyến uy tín nhất cho những người có nguyện vọng. Bạn cũng có thể chọn tham gia các chứng chỉ do công ty cung cấp, chẳng hạn như các chứng chỉ do Coursera cung cấp. Kỳ thi cấp chứng chỉ trực tuyến này đánh giá các kỹ năng CSS thực tế của bạn và hiểu biết cơ bản về cách sử dụng HTML và CSS để xây dựng trang web Xem thêm. Viễn thông là gì? Các loại CSSCascading Style Sheets hoặc CSS có thể có ba loại – nội tuyến, nhúng và bên ngoài 1. CSS kiểu nội tuyếnKhi tạo kiểu cho một phần tử HTML, CSS nội tuyến được sử dụng. Đó là một biểu định kiểu có thuộc tính CSS được gắn với một thành phần trong phần nội dung. Sử dụng thuộc tính kiểu, người ta có thể xác định biểu mẫu kiểu này trong thẻ HTML. Thuộc tính kiểu của phần tử HTML được sử dụng bởi CSS nội tuyến. Sẽ rất phức tạp nếu chỉ cập nhật một trang web bằng CSS nội tuyến Đây là trường hợp do yêu cầu mỗi thẻ HTML được trang trí riêng lẻ khi sử dụng CSS nội tuyến. Do đó, việc sử dụng nó không được khuyến khích. Kiểu CSS này thường được sử dụng để xem trước, thử nghiệm các sửa đổi và sửa chữa nhanh các trang web/trang web. Người ta có thể áp dụng CSS nội tuyến theo cách này.
Một ưu điểm là việc chèn mã CSS không yêu cầu tạo và tải lên một tệp riêng biệt, nhưng một nhược điểm là việc sử dụng quá nhiều CSS nội tuyến có thể làm cho cấu trúc HTML trở nên thiếu tổ chức 2. Biểu định kiểu xếp tầng được nhúngCòn được gọi là CSS nội bộ, kỹ thuật này đòi hỏi phải chèn mã CSS vào tệp HTML tương ứng với trang web nơi người dùng sẽ áp dụng kiểu dáng CSS. Đối với một trang HTML, định nghĩa kiểu CSS bên trong được sử dụng. Phần head> của trang HTML, cụ thể là phần tử style>, chứa định nghĩa của CSS nội bộ Điều này có thể được sử dụng khi một tài liệu HTML cần có một phong cách đặc biệt. Tạo kiểu cho một trang web cực kỳ dễ dàng với CSS nội bộ. Vì người ta phải đặt kiểu CSS trên mỗi trang web nên việc sử dụng nó cho một số trang web sẽ tốn nhiều công sức. Quá trình sử dụng CSS nội bộ hoặc nhúng như sau.
Một trong những lợi ích của nó là khi mã CSS được thêm vào trang HTML, nó sẽ ngăn các tệp bổ sung được tải lên. Thêm mã vào tài liệu HTML sẽ làm cho trang nhỏ hơn và tải nhanh hơn là một trong những nhược điểm của nó 3. Biểu định kiểu xếp tầng bên ngoàiTrang web phải kết nối với tệp bên ngoài có chứa mã CSS để đủ điều kiện sử dụng kiểu CSS bên ngoài. CSS bên ngoài là một kỹ thuật tạo kiểu CSS hiệu quả khi tạo một trang web lớn. Các nhà phát triển liên kết các trang web với bên ngoài. css khi sử dụng CSS bên ngoài. Người dùng có thể tạo kiểu trang web hiệu quả hơn bằng CSS. Người ta có thể thay đổi toàn bộ trang web cùng một lúc bằng cách thay đổi. tập tin css Điều này cho biết rằng người dùng chỉ có thể chọn một kiểu cho mỗi thành phần và kiểu đó sẽ được sử dụng trên tất cả các trang web. Sau đây là các bước để sử dụng CSS bên ngoài.
Một lợi ích là đó là một cách hiệu quả hơn, đặc biệt là để tạo kiểu cho một trang web lớn và một nhược điểm là việc gửi nhiều tệp CSS có thể khiến trang web mất nhiều thời gian hơn để tải xuống Xem thêm. GPS (Hệ thống định vị toàn cầu) là gì? Thuộc tính chính của CSSThuộc tính CSS xác định kiểu hoặc hành vi của phần tử HTML. Các ví dụ bao gồm kiểu phông chữ, chuyển đổi, đường viền, màu sắc và lề. Khai báo thuộc tính CSS bao gồm tên thuộc tính và giá trị thuộc tính. Sau dấu hai chấm, giá trị được liệt kê sau tên thuộc tính. Dấu chấm phẩy phân tách từng cặp tên-giá trị nếu có nhiều thuộc tính CSS được chỉ định. Mặc dù phần khai báo thuộc tính cuối cùng không được chứa dấu chấm phẩy, nhưng làm như vậy sẽ giúp việc thêm nhiều thuộc tính CSS trở nên đơn giản hơn mà không quên thêm dấu chấm phẩy thừa đó. Đối với các thành phần HTML khác nhau, người ta có thể đặt nhiều thuộc tính CSS, chẳng hạn như 1. Trưng bàyThuộc tính hiển thị kiểm soát loại hộp mà một phần tử tạo ra. Mặc dù màn hình có thể đảm nhận nhiều giá trị khác nhau nhưng chỉ có bốn giá trị được sử dụng thường xuyên nhất. Giá trị hiển thị mặc định cho từng phần tử được chỉ định trong đặc tả CSS 2. MàuMàu văn bản của một phần tử được xác định bởi tham số màu của nó. Chẳng hạn, thuộc tính màu của bộ chọn nội dung chỉ định màu văn bản mặc định của trang. Có một số định dạng được chấp nhận cho giá trị màu, nhưng những định dạng được sử dụng nhiều nhất là giá trị hex, RGB và màu được đặt tên 3. cú phápBiểu định kiểu CSS bao gồm một bộ quy tắc mà trình duyệt web diễn giải và sau đó áp dụng cho các thành phần trang được liên kết, chẳng hạn như đoạn văn, tiêu đề, v.v. Bộ chọn và một hoặc nhiều khai báo là hai thành phần cơ bản của quy tắc CSS 4. Tiểu sửTrình bày trực quan của trang web bị ảnh hưởng đáng kể bởi nền của nó. CSS cung cấp một số thuộc tính để tùy chỉnh nền của phần tử, chẳng hạn như màu nền, vị trí hình ảnh, định vị, v.v. Các thuộc tính nền là màu nền, hình nền, lặp lại nền, tệp đính kèm nền và vị trí nền 5. Phông chữNgười ta phải sử dụng đúng phông chữ và kiểu chữ để văn bản dễ đọc. Các tùy chọn tạo kiểu phông chữ văn bản trong CSS bao gồm thay đổi khuôn mặt của phông chữ, điều chỉnh kích thước và độ đậm của phông chữ, quản lý các biến thể, v.v. Font- family, -style, -weight, -size, và -variant là các thuộc tính phông chữ khác nhau 6. ChữCSS cung cấp một số tính năng giúp việc chỉ định các kiểu văn bản khác nhau trở nên đơn giản và hiệu quả, bao gồm màu sắc, căn chỉnh, giãn cách, trang trí, chuyển đổi, v.v. Một số thuộc tính văn bản thường được sử dụng bao gồm text-align, text-decoration, text-transform, text-indent, line-height, letter-spacing và word-spacing 7. Thứ nguyênNhà phát triển có thể quản lý chiều rộng và chiều cao của phần tử bằng cách sử dụng một số thuộc tính thứ nguyên của CSS, bao gồm chiều rộng, chiều cao, chiều rộng tối đa, chiều rộng tối thiểu, chiều cao tối đa và chiều cao tối thiểu. Màn hình thường xuyên sử dụng các thuộc tính chiều rộng và chiều cao. Phần đệm, đường viền và lề không được bao gồm trong chiều rộng và chiều cao 8. LềSử dụng các thuộc tính lề CSS, có thể đặt khoảng cách đường viền cho phần tử hộp. Lề của một phần tử luôn trong mờ, không phụ thuộc vào màu phông nền. Nếu phần tử cha có màu nền từ trước, nó sẽ hiển thị qua vùng lề 9. danh sáchCSS cung cấp nhiều thuộc tính để tạo kiểu dáng và định dạng danh sách có thứ tự và không có thứ tự phổ biến nhất. Mọi người thường có thể kiểm soát biểu mẫu hoặc giao diện của điểm đánh dấu bằng cách sử dụng các thuộc tính danh sách này. Trong số những thứ khác, bạn có thể điều chỉnh khoảng cách của điểm đánh dấu từ văn bản của danh sách 10. liên kếtMột trang web không thể hoạt động nếu không có kết nối, thường được gọi là siêu liên kết. Nó giúp người dùng có thể duyệt qua trang web. Thiết kế phù hợp các liên kết là một thành phần quan trọng trong việc tạo ra một trang web thân thiện với người dùng. Có bốn trạng thái chính cho các liên kết. liên kết, đã truy cập, đang hoạt động và di chuột Xem thêm. QoS (Chất lượng dịch vụ) là gì? 11. lớpVì văn bản, đồ họa và các thành phần khác được sắp xếp trên trang mà không chạm vào nhau nên các trang HTML được coi là hai chiều. Các hộp có thể được xếp chồng lên nhau theo chiều ngang, theo hướng dọc và dọc theo trục z 12. Độ dốcNgười ta có thể tăng tốc độ tải xuống và sử dụng ít băng thông hơn bằng cách sử dụng độ dốc. Đầu ra sẽ hiển thị nhanh hơn nhiều vì trình duyệt tạo ra nó và các mục chứa độ dốc có thể được thu nhỏ lên hoặc xuống ở bất kỳ mức độ nào mà không làm giảm chất lượng 13. Đề cươngNhà phát triển có thể chỉ định vùng đường viền hình hộp xung quanh một phần tử bằng cách sử dụng cài đặt đường viền của phần tử đó. Một đường được phác thảo ngay bên ngoài đường viền của các phần tử được gọi là đường viền. Đường viền biểu thị tiêu điểm hoặc trạng thái hoạt động cho các phần tử như nút, trường biểu mẫu, v.v. 14. bộ lọcThuộc tính bộ lọc CSS, chấp nhận một hoặc nhiều hàm bộ lọc theo thứ tự được chỉ định, có thể được sử dụng để áp dụng các hiệu ứng bộ lọc cho phần tử. Các nhà phát triển có thể sử dụng nó để thực hiện các hiệu ứng hình ảnh như làm mờ, cân bằng độ sáng hoặc độ tương phản, độ bão hòa màu, v.v. 15. Các đơn vịCác đơn vị tuyệt đối, như pixel, điểm, v.v. hoặc đơn vị tương đối, có thể đo chiều dài. Đối với các giá trị khác không, đơn vị CSS phải được chỉ định vì không có đơn vị mặc định. Một đơn vị vắng mặt hoặc bỏ qua sẽ được coi là một lỗi 16. độ mờĐộ mờ đã xuất hiện từ lâu trước khi nó được đưa vào thông số CSS phiên bản 3. Tuy nhiên, các trình duyệt cũ hơn có nhiều cài đặt khác nhau về độ mờ hoặc độ trong suốt. Phạm vi cho thuộc tính độ mờ là 0. 0 đến 1. 0. Sử dụng độ mờ CSS, các nhà phát triển cũng có thể tạo ra những bức ảnh trong mờ 17. Thẩm địnhXác thực trang web là quá trình đảm bảo các trang của trang web tuân thủ các tiêu chuẩn và quy tắc chính thức do World Wide Web Consortium (W3C) thiết lập. Xác minh là rất quan trọng. Nó sẽ đảm bảo rằng tất cả các trình duyệt web, công cụ tìm kiếm, v.v. , diễn giải các trang web của bạn theo cùng một cách 18. Chức vụMột thiết kế bố cục tốt yêu cầu các yếu tố được đặt chính xác trên các trang web. Bạn có thể định vị các mục bằng nhiều kỹ thuật CSS. Bạn có thể đọc riêng về các kỹ thuật sắp xếp này trong phần sau 19. đệmBạn có thể kiểm soát khoảng cách giữa nội dung và đường viền của phần tử bằng cách sử dụng thuộc tính đệm. Màu nền của phần tử có ảnh hưởng đến phần đệm. Chẳng hạn, nếu bạn đặt màu nền cho phần tử, vùng đệm sẽ hiển thị màu đó 20. Những cái bànDữ liệu dạng bảng, chẳng hạn như báo cáo tài chính được lấy từ hệ thống quản lý cơ sở dữ liệu (DBMS), thường được hiển thị trong bảng. Tuy nhiên, khi bạn tạo một bảng HTML không có bất kỳ kiểu hoặc thuộc tính nào, trình duyệt sẽ hiển thị chúng mà không có đường viền. Bạn có thể nâng cao đáng kể tính thẩm mỹ của bảng bằng CSS. Xem thêm. Năm giải pháp quản lý máy tính từ xa hàng đầu cho kỷ nguyên làm việc kết hợp Lấy điBiểu định kiểu xếp tầng hoặc CSS hiện là một yếu tố phát triển web. Nó không chỉ được sử dụng để tạo kiểu trang web mà còn với sự phát triển của thương mại điện tử, sách điện tử, ứng dụng dựa trên web, v.v. , nó hỗ trợ hầu hết các trải nghiệm người dùng trực tuyến của chúng tôi. CSS hiện đang ở phiên bản 3, với CSS4 đang hoạt động. Biết cách CSS hoạt động và hiểu JavaScript và HTML có thể là công cụ xây dựng nội dung web tốt hơn cho doanh nghiệp. 3 loại CSS là gì?Có ba loại CSS được đưa ra bên dưới. . CSS nội tuyến CSS nội bộ hoặc nhúng CSS bên ngoài Một số tính năng của CSS là gì?Với CSS, bạn có thể kiểm soát màu sắc, phông chữ, kích thước của văn bản, khoảng cách giữa các phần tử, cách các phần tử được định vị và trình bày, hình nền hoặc màu nền nào sẽ được sử dụng, các cách hiển thị khác nhau cho các thiết bị và kích thước màn hình khác nhau cũng như
Những lợi ích chính của việc sử dụng CSS là gì?Có một số lợi ích của CSS, bao gồm. . 1) Tốc độ trang nhanh hơn. Nhiều mã hơn có nghĩa là tốc độ trang chậm hơn. . 2) Trải nghiệm người dùng tốt hơn. CSS không chỉ làm cho các trang web dễ nhìn mà còn cho phép định dạng thân thiện với người dùng. . 3) Thời gian phát triển nhanh hơn. . 4) Thay đổi định dạng dễ dàng. . 5) Khả năng tương thích trên các thiết bị CSS là gì giải thích các tính năng và lợi ích của nó?CSS xử lý thiết kế và cảm thấy là một phần của trang internet. Sử dụng CSS, bạn sẽ kiểm soát màu sắc của văn bản, thiết kế phông chữ, khoảng cách giữa các đoạn văn, kích thước và bố cục của các cột, v.v. CSS hướng dẫn hiển thị HTML về cách trang web sẽ hiển thị ở cuối người dùng |