Chỉ định đơn vị đo kích thước ký tự. Hướng dẫn nhanh về đơn vị CSS

Các đơn vị Kích thước CSSđược sử dụng để xác định số lượng trong các thuộc tính khác nhau. Chúng được chia thành tuyệt đối và tương đối.

Đơn vị tuyệt đối

Đơn vị đo tuyệt đối bao gồm centimet (cm), milimét (mm) và inch (in). Mặc dù chúng được thiết kế để hiển thị các phần tử trên một trang web một cách thống nhất, nhưng trình duyệt không phải lúc nào cũng có thể tính toán chính xác kích thước vật lý của màn hình hoặc màn hình, vì vậy các thiết bị khác nhau các phần tử có thể có kích thước khác nhau.

Một cm ( cỡ chữ: 1cm; ) .one-mm ( cỡ chữ: 1mm; ) .one-in ( cỡ chữ: 1in; )

Thông thường, các đơn vị đo lường này được sử dụng khi chỉ định kích thước cho trang in.

Đơn vị kiểu chữ

Đơn vị đo lường typographic bao gồm điểm (pt) và đỉnh (pc). Một điểm (1pt) có kích thước cố định là 1/72" trong khi pica (1pc) là 1/6" (1pc = 12pt). Hai đơn vị đo lường này hữu ích nhất trong các phong cách viết cho tài liệu in hơn là sử dụng trên màn hình.

Một điểm ( font-size: 1pt; ) .one-pica ( font-size: 1pc; )

Đơn vị tương đối

Đơn vị đo lường tương đối bao gồm pixel (px) và tỷ lệ phần trăm (%). Tỷ lệ phần trăm là đơn vị đo lường không liên quan trực tiếp đến kích thước phông chữ của một phần tử hoặc kích thước của chính phần tử đó. Giá trị của một thuộc tính được đặt dưới dạng phần trăm trực tiếp phụ thuộc vào giá trị của cùng một thuộc tính được đặt cho phần tử cha. Ví dụ: kích thước phông chữ được đặt tương ứng với kích thước phông chữ của phần tử cha và chiều cao và chiều rộng được biểu thị dưới dạng phần trăm so với chiều cao và chiều rộng của vùng nội dung của phần tử cha.

Một pixel ( font-size: 1px; ) .one-percent ( font-size: 1%; )

Pixel là một điểm bằng một pixel vật lý trên màn hình. Tuy nhiên, các trình duyệt không phải lúc nào cũng tính toán chính xác kích thước của khung nhìn bằng pixel.

Hãy xem xét mẫu mã mới nhất máy tính xách tay, máy tính bảng và điện thoại thông minh được trang bị màn hình với độ phân giải cao. Trên các thiết bị như vậy, trình duyệt không tương quan đơn vị px với số lượng pixel vật lý trên màn hình. Thay vào đó, nó bình thường hóa đơn vị px để mang lại trải nghiệm xem gần hơn với màn hình máy tính để bàn truyền thống, với mật độ điểm ảnh dao động từ 96 đến 120 pixel/inch. Do đó, một hình vuông có cạnh 10px có thể được trình duyệt trên điện thoại thông minh vẽ sao cho có từ 15 đến 20 pixel vật lý trên mỗi cạnh. Điều này có nghĩa là px cũng là đơn vị đo lường tương đối.

Đơn vị tương đối phụ thuộc vào phông chữ

Hai đơn vị đo lường tương đối bổ sung là em và ex. Em là chiều cao của phông chữ hiện tại, ex là chiều cao của ký tự "x" viết thường trong phông chữ được chỉ định.

One-ex ( font-size: 1ex; ) .one-em ( font-size: 1em; )

Giống như tỷ lệ phần trăm, em là đơn vị đo lường phổ biến thường được sử dụng để đặt kích thước phông chữ cho văn bản trên trang web.

CSS3 giới thiệu thêm hai đơn vị đo lường: rem và ch. Rem - cỡ chữ của phần tử gốc ( ), nó có thể được sử dụng thay vì em để ngăn kích thước phông chữ cha mẹ hoặc tổ tiên ảnh hưởng đến kích thước phông chữ của phần tử hiện tại.

Một-rem ( cỡ chữ: 1rem; )

Đơn vị ch bằng độ rộng của ký tự 0 (0) trong phông chữ của phần tử. Việc sử dụng nó có thể hữu ích trong việc xác định độ rộng của trường chứa văn bản, vì 1ch gần tương ứng với một ký tự.

00000

Đơn vị ch chỉ được hỗ trợ trong Chrome 27+, Firefox 19+ và IE9. Rem được hỗ trợ trong Chrome 4+, Firefox 3.6+, IE9+, Safari 4.1+ và Opera 11.6+.

Đơn vị khung nhìn

Các đơn vị khung nhìn bao gồm vw (chiều rộng) và vh (chiều cao), cho phép bạn chia tỷ lệ các phần tử tương ứng với khung nhìn, là phần hiển thị của trang web.

chiều rộng: 50vw; /* 50% chiều rộng khung nhìn */ chiều cao: 25vh; /* 25% chiều cao khung nhìn */

Hai đơn vị bổ sung là vmin và vmax, chỉ định giá trị tối thiểu hoặc tối đa cho kích thước của khung nhìn.

Chiều rộng: 1vmin; /* 1vh hoặc 1vw, tùy theo giá trị nào nhỏ hơn */ chiều cao: 1vmax; /* 1vh hoặc 1vw, tùy theo giá trị nào lớn hơn */

Các đơn vị khung nhìn tương đối được hỗ trợ trong Chrome 26+, Firefox 19+, IE11+, Safari 6.1+ và Opera 15+.

Giá trị đơn vị

Các giá trị không nhất thiết phải được chỉ định dưới dạng số nguyên; chúng cũng có thể được chỉ định dưới dạng số thập phân. Một số thuộc tính cũng cho phép bạn chỉ định giá trị âm làm giá trị.

P ( cỡ chữ: 0,394in; ) /* số thập phân */ p ( lề: -1px; ) /* giá trị âm */

Lưu ý rằng việc khai báo sẽ không hoạt động nếu đơn vị đo đứng trước một khoảng trắng hoặc nếu đơn vị đo không được chỉ định (ngoại trừ giá trị bằng 0). Nếu số 0 được sử dụng làm giá trị thì đơn vị đo có thể được bỏ qua.

P ( cỡ chữ: 1ex; ) /* đúng */ p ( cỡ chữ: 0; ) /* đúng */ p ( cỡ chữ: 0ex; ) /* đúng */ p ( cỡ chữ: 1 ex ; ) /* sai */ p ( font-size: 1; ) /* sai */

Bất cứ khi nào một khai báo CSS có lỗi, nó sẽ bị trình duyệt bỏ qua, trong khi phần còn lại của khai báo vẫn tiếp tục hoạt động.

Một trong những khía cạnh khó hiểu nhất CSS là ứng dụng cỡ chữ thuộc tính để chia tỷ lệ văn bản. Sử dụng CSS bạn có thể thay đổi kích thước văn bản trong trình duyệt bằng cách sử dụng bốn đơn vị khác nhauđo. Đơn vị nào trong bốn đơn vị này là tốt nhất cho web? Đây là một câu hỏi đã gây ra nhiều cuộc thảo luận và chỉ trích khác nhau. Tìm một câu trả lời dứt khoát là khó vì bản thân câu hỏi đã phức tạp.

Gặp gỡ các đơn vị

1. "Ems" (em): "em" là đơn vị có khả năng mở rộng được sử dụng trong các tài liệu web. "em" bằng cỡ chữ hiện tại, ví dụ: nếu cỡ chữ trong tài liệu là 12pt thì 1em bằng 12pt. Về bản chất, "em" có khả năng mở rộng nên 2em sẽ bằng 24pt, 0,5em sẽ bằng 6pt, v.v. Việc sử dụng "em" ngày càng trở nên phổ biến trong các tài liệu web do khả năng mở rộng và khả năng sử dụng hữu ích của nó trong thiêt bị di độngỒ.
2. Pixel (px): “px” là các đơn vị có kích thước cố định được sử dụng trên màn hình (chẳng hạn như để đọc trên màn hình máy tính). Một pixel bằng một dấu chấm trên màn hình máy tính của bạn (phần tử nhỏ nhất trong độ phân giải màn hình của bạn). Nhiều nhà thiết kế web sử dụng px trong tài liệu web để đạt được sự thể hiện hoàn hảo đến từng pixel cho trang web của họ khi hiển thị trong trình duyệt. Một trong những vấn đề khi sử dụng px là các đơn vị này không cho phép chia tỷ lệ cho người đọc hoặc thiết bị di động khiếm thị.
3. Điểm (pt): "pt", theo truyền thống được sử dụng trong phương tiện in ấn (bất cứ thứ gì cần in trên giấy, v.v.). Một "pt" bằng 1/72 inch. "pt", giống như "px", có kích thước đơn vị cố định và không thể chia tỷ lệ.
4. Phần trăm (%): Đơn vị phần trăm tương tự như "em" ngoại trừ một số khác biệt chính. Đầu tiên, cỡ chữ hiện tại là 100% (tức là 12pt = 100%). Bằng cách sử dụng "%", văn bản của bạn sẽ có khả năng mở rộng hoàn toàn cho thiết bị di động và sự thân thiện với người dùng (khả năng truy cập).

Vậy sự khác biệt là gì?

Sẽ dễ dàng hiểu được sự khác biệt giữa các đơn vị kích thước phông chữ khi bạn nhìn thấy chúng hoạt động. Thông thường, 1em = 12pt = 16px = 100%. Khi sử dụng các cỡ chữ này, hãy xem điều gì xảy ra khi bạn tăng kích thước cơ sở phông chữ (dùng Bộ chọn CSS cơ thể) từ 100% đến 120%.

Thay đổi cỡ chữ từ 100% thành 120%.

Như bạn có thể thấy, "em" và "%" đã tăng kích thước phông chữ, trong khi "px" và "pt" thì không. Việc đặt kích thước tuyệt đối cho văn bản của bạn có thể dễ dàng nhưng sẽ tốt hơn nhiều nếu khách truy cập sử dụng văn bản có thể mở rộng có thể hiển thị trên bất kỳ thiết bị hoặc máy nào. Vì lý do này, đơn vị "em" và "%" được ưu tiên sử dụng cho văn bản tài liệu web.

"em" so với "%"

Chúng tôi phát hiện ra rằng các đơn vị “px” và “pt” không phải là Cách tốt nhất có thể phù hợp với các tài liệu web, buộc chúng ta phải sử dụng "em" và "%". Về lý thuyết, đơn vị "em" và "%" giống hệt nhau, nhưng trên thực tế, chúng có những khác biệt nhỏ cần được xem xét.

Trong ví dụ trên, chúng tôi đã sử dụng tỷ lệ phần trăm (trong thẻ nội dung) làm đơn vị kích thước phông chữ cơ bản. Nếu bạn thay đổi đơn vị kích thước phông chữ cơ bản từ "%" thành "em" (nghĩa là nội dung (cỡ chữ: 1em;)), thì bạn, nên không nhận thấy sự khác biệt. Hãy xem điều gì xảy ra khi "1em" là đơn vị cơ sở của chúng tôi và khi khách hàng thay đổi "Kích thước phông chữ" trong cài đặt trình duyệt của họ (nhiều trình duyệt, chẳng hạn như Internet Explorer, có tùy chọn này).


Kích thước phông chữ khi khách hàng thay đổi kích thước văn bản trong trình duyệt.

Khi kích thước văn bản được đặt thành "trung bình" trong trình duyệt máy khách, không có sự khác biệt đáng chú ý giữa "em" và "%". Tuy nhiên, nếu thay đổi tham số, sự khác biệt sẽ trở nên rất lớn. Khi đặt thành “Nhỏ nhất”, “em” nhỏ hơn nhiều so với “%”, và khi đặt thành “Lớn nhất”, ngược lại, “em” hiển thị lớn hơn “%”. Và trong khi nhiều người tranh luận rằng các đơn vị trong tỷ lệ "em" như dự định, thì trên thực tế, văn bản trong "em" có tỷ lệ quá lớn, khiến cho văn bản nhỏ nhất trở nên không đọc được trên một số máy.

Phán quyết

Về lý thuyết, đơn vị "em" là tiêu chuẩn cỡ chữ mới và sắp ra mắt trên web, nhưng trên thực tế, đơn vị "%" cho phép văn bản được hiển thị nhất quán và thuận tiện hơn cho người dùng. Khi thay đổi tham số của khách hàng, văn bản trong "%" thay đổi theo tỷ lệ hợp lý, cho phép nhà thiết kế duy trì khả năng đọc, khả năng truy cập và thiết kế.

Người chiến thắng: phần trăm (%).

Các đơn vị tương đối mới đã được thêm vào CSS3 như vh , vw , vmin , vmax . Các đơn vị này được tính tương ứng với kích thước của cửa sổ trình duyệt. Vì máy tính để bàn chiều rộng cửa sổ trình duyệt chiều rộng hơn khung nhìn (chiều rộng của thanh cuộn được thêm vào), vì vậy nếu bạn đặt chiều rộng của phần tử thành 100vw, nó sẽ vượt xa html.



Cơm. 1. Ảnh nền toàn màn hình có chiều rộng 100vw

Hỗ trợ trình duyệt

I E: 9.0 ngoại trừ vmax, sử dụng vm thay vì vmin
Bờ rìa: 12.0 ngoại trừ vmax, sử dụng vm thay vì vmin
Firefox: 19.0
Trình duyệt Chrome: 26.0
Opera: 15.0
Cuộc đi săn: 6.1
Safari của iOS: 8.0
Android: 4.4
Trình duyệt Chrome dành cho Android: 55.0

1. Đơn vị vh và vw

Kỹ thuật thiết kế web đáp ứng dựa trên việc sử dụng các giá trị phần trăm. Nhưng sự quan tâm còn xa Quyết định tốt nhất cho từng trường hợp, vì chúng được tính tương ứng với kích thước của phần tử cha gần nhất. Vì vậy, nếu bạn muốn sử dụng chiều cao và chiều rộng của cửa sổ trình duyệt, tốt hơn nên sử dụng đơn vị vh và vw. Ví dụ: nếu chiều cao cửa sổ trình duyệt là 900px thì 1vh sẽ là 9px. Tương tự, nếu chiều rộng cửa sổ trình duyệt là 1600px thì 1vw sẽ là 16px.

1.1. Hình nền toàn màn hình đáp ứng

Vì chiều rộng phần tử được chỉ định bằng 100vw lớn hơn chiều rộng khung nhìn, nên để tạo ảnh nền toàn màn hình, tốt hơn nên sử dụng chiều rộng 100%, sẽ bằng chiều rộng của phần tử html gốc.

Toàn màn hình-bg ( nền: url(image.jpg); vị trí nền: giữa; kích thước nền: bìa; chiều rộng: 100%; chiều cao: 100vh; ) Cơm. 2. Hình nền toàn màn hình đáp ứng

1.2. Hiệu ứng trượt toàn trang

Để tạo khối bằng toàn bộ chiều cao của cửa sổ trình duyệt, bạn cần đặt chiều cao: 100%; cho ba phần tử - html, body và trực tiếp cho chính khối đó:

Phần Html, nội dung ( chiều cao: 100%; ) ( chiều cao: 100%; )

Vì kích thước phần trăm được tính tương ứng với giá trị của các phần tử cha nên bạn cần đặt các giá trị phù hợp cho từng phần tử DOM. Đơn vị đo vh không yêu cầu chuỗi giá trị, vì giá trị của nó được tính trực tiếp tương ứng với cửa sổ trình duyệt:

Phần ( chiều cao: 100vh; )

Hiệu ứng lật qua các slide khi bạn click vào mũi tên được thực hiện bằng cách sử dụng kịch bản nhỏ jQuery:

JQuery(document).ready(function($) ( $("nav").on("click", function() ( if ($(this).hasClass("down")) ( var movePos = $(window ).scrollTop() + $(window).height(); ) if ($(this).hasClass("top")) ( var movePos = $(window).scrollTop() - $(window).height( ); ) $("html, body").animate(( ScrollTop: movePos), 600); )); ));

Chiều cao được chỉ định bằng vh cũng có thể được sử dụng để căn giữa một phần tử trên trang.

Tôi đã đề cập đến các đơn vị đo lường mới (tương đối). Các đơn vị này là vw, vh, vmin và vmax và dựa trên kích thước khung nhìn của trình duyệt. Kích thước thực tế của chúng thay đổi khi khung nhìn của trình duyệt thay đổi, khiến các đơn vị này trở nên lý tưởng cho thiết kế thích ứng. Mặc dù trong bài viết trước tôi đã phản đối việc sử dụng các đơn vị này để chỉ định kích thước phông chữ, nhưng chúng có thể rất hữu ích khi làm việc với các thành phần bố cục.

Đơn vị khung nhìn

Các đơn vị số đo khung nhìn là những đơn vị tương đối, có nghĩa là chúng không thể được đo lường một cách khách quan. Kích thước của chúng được xác định bởi kích thước của khung nhìn trình duyệt. Có bốn đơn vị liên quan đến khung nhìn.

Tôi sẽ tập trung vào hai cái đầu tiên vì chúng được sử dụng phổ biến nhất. Trong nhiều trường hợp đơn vị khung nhìn(vh và vw) giao nhau với tỷ lệ phần trăm về khả năng. Tuy nhiên, mỗi người trong số họ đều có điểm mạnh và điểm yếu riêng.

Tóm lại, nó trông như thế này:

Khi xử lý chiều rộng, % sẽ tốt hơn và khi xử lý chiều cao, vh sẽ tốt hơn.

Các phần tử có chiều rộng toàn trang: % > vw

Như tôi đã nói, vw xác định kích thước của phần tử dựa trên chiều rộng của khung nhìn. Tuy nhiên, trình duyệt tính toán kích thước dựa trên khoảng trống cho thanh cuộn.

Nếu chiều rộng trang vượt quá chiều rộng khung nhìn, thanh cuộn sẽ xuất hiện. Tuy nhiên, trên thực tế chiều rộng của khung nhìn lớn hơn chiều rộng của phần tử html

Chế độ xem> html> nội dung

Vì vậy, nếu bạn đặt chiều rộng của phần tử thành 100vw, phần tử sẽ mở rộng ra ngoài html và nội dung. V. trong ví dụ này Tôi đã tạo một đường viền màu đỏ xung quanh phần tử html và tô màu các phần bằng các màu khác nhau.

Do sắc thái này, tốt hơn là tạo các phần tử trên toàn bộ chiều rộng của trang bằng cách sử dụng tỷ lệ phần trăm, thay vì dựa vào chiều rộng của khung nhìn.

Phần tử chiều cao toàn trang: vh > %

Khi tạo các phần tử cần có cùng chiều cao với trang, sẽ tốt hơn nhiều khi sử dụng vh thay vì tỷ lệ phần trăm. Vì kích thước phần trăm của một phần tử có liên quan đến phần tử cha của nó nên chúng ta có thể lấy được chiều cao của phần tử chiều cao bằng nhau chỉ màn hình nếu phần tử cha của nó cũng chiếm toàn bộ chiều cao của màn hình. Điều này có nghĩa là chúng ta phải định vị phần tử là cố định để thực hiện phần tử html cha mẹ hoặc sử dụng một số loại hack.

Sử dụng vh để đạt được hiệu ứng này khá đơn giản:

Ví dụ ( chiều cao: 100vh; )

Bất kể phần tử .example được lồng như thế nào, kích thước của nó có thể được đặt tương ứng với kích thước của khung nhìn. Vấn đề cuộn sẽ không làm phiền chúng tôi vì hầu hết các trang web đều không có thanh cuộn ngang

Dưới đây là một số ví dụ về cách sử dụng đơn vị vh.

Hình nền toàn màn hình

Một cách sử dụng điển hình của đơn vị vh là tạo ra hình nền, trải dài toàn bộ chiều cao và chiều rộng của màn hình, bất kể kích thước thiết bị. Điều này khá dễ thực hiện.

Bg (vị trí: tương đối; nền: url("bg.jpg") trung tâm/bìa; chiều rộng: 100%; chiều cao: 100vh; )

Theo cách tương tự, chúng ta có thể tạo hiệu ứng “trang” bằng cách cung cấp cho mỗi phần kích thước của khung nhìn.

Phần ( chiều rộng: 100%; chiều cao: 100vh; )

Chúng ta có thể sử dụng JavaScript để tạo ảo giác về việc lật trang.

$("nav").on("click", function() ( if ($(this).hasClass("down")) ( var movePos = $(window).scrollTop() + $(window).height (); ) if ($(this).hasClass("up")) ( var movePos = $(window).scrollTop() - $(window).height(); ) $("html, body"). animate((scrollTop: movePos ), 1000); ))

Hình ảnh gấp

Vh cũng có thể được sử dụng để kiểm soát kích thước của hình ảnh trong một trang. Ví dụ, trong khuôn khổ một bài viết. Chúng tôi muốn đảm bảo rằng mọi hình ảnh sẽ được hiển thị toàn bộ bất kể kích thước màn hình.

Chúng tôi sẽ cần đoạn mã sau

Img ( width: auto; /* Chiều rộng tự động tỷ lệ với chiều cao */ max-width: 100%; /* Không lớn hơn chiều rộng của phần tử cha */ max-height: 90vh; /* Không lớn hơn chiều cao của khung nhìn */ lề: 2rem auto; )

Hỗ trợ trình duyệt

Vì các thiết bị này tương đối mới nên vẫn có vấn đề với một số trình duyệt nhất định.

Đây là cách giải quyết chúng.

CSS sử dụng các đơn vị tuyệt đối và tương đối để định kích thước các phần tử khác nhau. Đơn vị tuyệt đối độc lập với thiết bị đầu ra, nhưng đơn vị tương đối xác định kích thước của một phần tử so với giá trị của kích thước khác.

Đơn vị tương đối

Đơn vị tương đối thường được sử dụng để làm việc với văn bản. Trong bảng 1 liệt kê các đơn vị tương đối chính.

Đơn vị em là giá trị thay đổi, tùy thuộc vào kích thước phông chữ của phần tử hiện tại (kích thước được đặt thông qua thuộc tính kiểu phông chữ). Mỗi trình duyệt có kích thước văn bản tích hợp được sử dụng khi kích thước này không được chỉ định rõ ràng. Do đó, ban đầu 1em bằng cỡ chữ mặc định của trình duyệt hoặc cỡ chữ của phần tử gốc. Ký hiệu phần trăm giống hệt với em, trong đó giá trị của 1em và 100% bằng nhau.

Đơn vị cũ được định nghĩa là chiều cao của ký tự "x" viết thường. ex phải tuân theo các quy tắc tương tự như em, cụ thể là nó bị ràng buộc với kích thước phông chữ mặc định của trình duyệt hoặc kích thước phông chữ của phần tử cha của nó.

Đơn vị ch bằng độ rộng của ký tự "0" đối với phần tử hiện tại và giống như em, phụ thuộc vào kích thước phông chữ.

Sự khác biệt giữa em và rem như sau. em phụ thuộc vào kích thước phông chữ của phần tử gốc và thay đổi theo nó, còn rem được gắn với phần tử gốc, tức là kích thước phông chữ được chỉ định cho phần tử html.

Ngoài ra còn có một nhóm đơn vị tương đối gắn liền với kích thước của khung nhìn trình duyệt. Trong bảng 2 hiển thị danh sách chúng kèm theo mô tả.

Đơn vị tuyệt đối

Đơn vị tuyệt đối là kích thước vật lý- inch, cm, milimét, điểm, picas và pixel. Đối với các thiết bị có dpi thấp (số pixel trên inch xác định mật độ pixel), liên kết là trên mỗi pixel. Trong trường hợp này, một inch bằng 96 pixel. Rõ ràng, inch thật sẽ không khớp với inch trên thiết bị như vậy. Trên các thiết bị có độ phân giải cao, inch thực bằng inch trên màn hình nên kích thước pixel được tính là 1/96 inch. Trong bảng 3 liệt kê các đơn vị tuyệt đối cơ bản.

Ví dụ

Đơn vị tương đối

tiêu đề 30px

Cỡ chữ 1,5 em

Đơn vị tuyệt đối

Tiêu đề 24 điểm

Dịch văn bản sang phải 30 mm

Ghi chú

Khi cài đặt kích thước, hãy đảm bảo chỉ định đơn vị đo, ví dụ: chiều rộng: 30px. Nếu không, trình duyệt sẽ không thể hiển thị kết quả mong muốn vì nó không hiểu kích thước bạn yêu cầu. Đơn vị không được thêm vào chỉ khi giá trị 0(lề: 0).

Internet Explorer hỗ trợ đơn vị vm thay vì vmin.

Sự chỉ rõ

Mỗi thông số kỹ thuật đều trải qua nhiều giai đoạn phê duyệt.

  • Khuyến nghị - Thông số kỹ thuật đã được W3C phê duyệt và được khuyến nghị làm tiêu chuẩn.
  • Đề xuất ứng viên ( Khuyến nghị có thể ) - nhóm chịu trách nhiệm về tiêu chuẩn hài lòng vì đã đáp ứng được mục tiêu của mình nhưng cần có sự trợ giúp từ cộng đồng phát triển để thực hiện tiêu chuẩn.
  • Khuyến nghị đề xuất Khuyến nghị được đề xuất) - ở giai đoạn này, tài liệu được gửi tới Hội đồng tư vấn của W3C để phê duyệt lần cuối.
  • Bản dự thảo đang hoạt động - Một phiên bản hoàn thiện hơn của bản dự thảo đã được thảo luận và sửa đổi để cộng đồng xem xét.
  • Bản thảo của người biên tập ( bản thảo biên tập) - phiên bản dự thảo của tiêu chuẩn sau khi các biên tập viên dự án thực hiện các thay đổi.
  • Bản nháp ( Thông số kỹ thuật dự thảo) - phiên bản dự thảo đầu tiên của tiêu chuẩn.
×