Tại sao thẻ <centre> không được dùng trong HTML?

Tôi chỉ tò mò về lý do tại sao <center>thẻ trong HTML không được dùng nữa.

Đây <center>là một cách đơn giản để nhanh chóng căn chỉnh các khối văn bản và hình ảnh bằng cách đóng gói thùng chứa trong <center>thẻ và tôi thực sự không thể tìm thấy bất kỳ cách đơn giản nào về cách thực hiện ngay bây giờ.

Bất cứ ai cũng biết bất kỳ cách đơn giản nào về cách tập trung vào "công cụ" (không phải thứ margin-left:auto; margin-right:auto;và chiều rộng), thứ gì đó thay thế <center>? Và tại sao nó lại bị phản đối?

Phần <center>tử không được chấp nhận vì nó xác định cách trình bày nội dung của nó - nó không mô tả nội dung của nó.

Một phương pháp định tâm là đặt thuộc tính margin-leftvà margin-rightthuộc tính của phần tử thành auto, sau đó đặt thuộc tính của phần tử cha text-alignthành center. Điều này đảm bảo rằng phần tử sẽ được tập trung trong tất cả các trình duyệt hiện đại.

Theo W3Schools.com ,

Phần tử trung tâm không được dùng trong HTML 4.01 và không được hỗ trợ trong XHTML 1.0 Strict DTD.

Thông số kỹ thuật HTML 4.01 đưa ra lý do này để loại bỏ thẻ:

Phần tử TRUNG TÂM chính xác tương đương với việc chỉ định phần tử DIV với thuộc tính align được đặt thành "centre".

Những gì tôi làm là thực hiện các tác vụ phổ biến như định tâm hoặc thả nổi và tạo các lớp CSS từ chúng. Khi tôi làm điều đó tôi có thể sử dụng chúng trong bất kỳ trang nào. Tôi cũng có thể gọi nhiều như tôi muốn trên cùng một yếu tố.

.text_center {text-align: center;}
.center {margin: auto 0px;}
.float_left {float: left;}

Bây giờ tôi có thể sử dụng chúng trong mã HTML của mình để thực hiện các tác vụ đơn giản.

<p class="text_center">Some Text</p>

Thỉnh thoảng tôi vẫn sử dụng thẻ <centre> vì không có gì trong CSS hoạt động cả. Ví dụ về việc cố gắng sử dụng thủ thuật <div> và thất bại:

<div style="text-align: center;">This div is centered, but it's a simple example.</div>
<br />
<div style="text-align: center;"><table border="1"><tr><td>&lt;div style="text-align: center;"&gt; didn't center correctly.</td></tr></table></div>
<br />
<div style="text-align: center;margin-left:auto;margin-right:auto"><table border="1"><tr><td>&lt;div style="text-align: center;margin-left:auto;margin-right:auto"&gt; still didn't center either</td></tr></table></div>
<br />
<center><table border="1"><tr><td>Actually Centered with &lt;center&gt; tag</td></tr></table></center>

<centre> nhận kết quả. Để sử dụng CSS thay vào đó, đôi khi bạn phải đặt CSS ở một vài nơi và lộn xộn với nó để đưa nó vào trung tâm. Để trả lời câu hỏi của bạn, CSS đã trở thành một tôn giáo với các tín đồ và tín đồ xa lánh <centre> <b> <i> <u> là báng bổ, không linh thiêng và quá đơn giản vì mục đích bảo mật công việc của họ. Và nếu họ cố gắng đưa <bảng> của bạn ra khỏi bạn, hãy hỏi họ xem CSS tương đương với thuộc tính colspan hay rowspan là gì.

Đó không phải là sự thật trừu tượng hay mọt sách, mà là sự thật sống còn có giá trị.
-- Thiền học

Bạn vẫn có thể sử dụng điều này với XHTML 1.0 Chuyển tiếp và HTML 4.01 Chuyển tiếp nếu bạn muốn. Cách khác duy nhất (theo cách tốt nhất, theo ý kiến ​​của tôi) là với lề:

<div style="width:200px;margin:auto;">
  <p>Hello World</p>
</div>

HTML của bạn nên xác định thành phần, không chi phối phần trình bày của nó.

Nó dự định đánh dấu, tức là các thẻ HTML, thể hiện ý nghĩa và cấu trúc, chứ không phải ngoại hình. Nó đã bị lẫn lộn trong các phiên bản đầu tiên của HTML nhưng các tiêu chuẩn mọi người đang cố gắng làm sạch nó ngay bây giờ.

Một vấn đề với việc để thẻ kiểm soát ngoại hình là các trang của bạn không chơi tốt với các thiết bị dành cho người khuyết tật, chẳng hạn như trình đọc màn hình. Điều này cũng dẫn đến việc có rất nhiều thẻ trong văn bản của bạn không giúp làm rõ nghĩa, mà thay vào đó làm lộn xộn nó với thông tin ở cấp độ khác.

Vì vậy, CSS đã được nghĩ đến để di chuyển định dạng / hiển thị sang một ngôn ngữ khác, tách biệt với văn bản và có thể dễ dàng được giữ theo cách đó. Trong số những thứ khác, điều này cho phép chuyển đổi bảng định kiểu để thay đổi giao diện của trang Web mà không cần chạm vào đánh dấu khác. Và để có thể làm điều đó cho rất nhiều trang trong một lần sưng.

Các công cụ CSS cung cấp cho bạn để làm điều này không phải lúc nào cũng thanh lịch, tôi đứng về phía bạn ở đó. Ví dụ, không có cách nào để thực hiện định tâm dọc hiệu quả. Và định tâm ngang, nếu nó không chỉ là văn bản có thể sửa đổi được text-align, thì không tốt hơn nhiều.

Bạn có thể lựa chọn làm dễ dàng, hiệu quả và lầy lội hoặc sạch sẽ, thanh lịch và cồng kềnh. Tôi không hiểu tại sao các nhà phát triển Web đưa ra mớ hỗn độn này, nhưng tôi đoán họ rất vui khi có ít nhất một cơ hội để hoàn thành công việc của họ.

HTML được thiết kế để cấu trúc dữ liệu, không kiểm soát bố cục. CSS được dự định để kiểm soát bố cục. Bạn cũng sẽ thấy rằng nhiều nhà thiết kế cau mày khi sử dụng <table>cho bố cục vì lý do rất giống nhau này.

Đối với văn bản và hình ảnh bạn có thể sử dụng text-align:

<div style="text-align: center;">
    I'm centered.
</div>

CSS có một thuộc text-align: centertính và vì đây hoàn toàn là một thứ trực quan, không phải là ngữ nghĩa, nên nó phải được chuyển sang CSS, không phải HTML.

Thực phẩm cho suy nghĩ: một trình tổng hợp văn bản thành giọng nói sẽ làm gì với <center>?

Bạn có thể thêm nó vào css của bạn và sử dụng <div class="center"></div>

.center{
  text-align: center;
  margin: auto;
  justify-content: center;
  display: flex;
}

hoặc nếu bạn muốn giữ <center></center>và chuẩn bị trong trường hợp nó bị xóa, hãy thêm nó vào css của bạn

center{
  text-align: center;
  margin: auto;
  justify-content: center;
  display: flex;
}

Câu trả lời phổ biến nhất

1. Thẻ không dùng nữa không nhất thiết là thẻ xấu ;
2. Có là thẻ mà đối phó với logic trình bày, centerlà một trong số họ;
3. Một centerthẻ không giống như một div với text-align:center;
4. Thực tế là bạn có một cách khác để làm điều gì đó không làm cho nó không hợp lệ.

Hãy để tôi giải thích bởi vì có những kẻ hạ bệ khét tiếng ở đây, những người sẽ nghĩ tôi đang bảo vệ HTML4 cũ hay gì đó. Không, tôi không phải. Nhưng cuộc tranh luận xung quanh centerchỉ đơn giản là một cuộc chiến xu hướng, không có lý do thực sự nào để bỏ một thẻ phục vụ mục đích hợp lệ.

Vì vậy, hãy xem các đối số chính chống lại nó.

• "Nó mô tả trình bày, không phải ngữ nghĩa!"
  Không. Nó mô tả một sự sắp xếp hợp lý - và có có giao diện mặc định, giống như các thẻ khác thích<p>hoặc<ul>làm. Nhưng vấn đề là mối quan hệ của phần kèm theo với môi trường xung quanh. Trung tâm nói "đây là một cái gì đó chúng tôi tách biệt bằng cách định vị trực quan khác nhau".

• "Nó không hợp lệ"
  Đúng vậy. Nó chỉ bị phản đối, như trong, có thể được gỡ bỏ sau đó . Trong hơn 15 năm nay. Và nó không đi đâu cả, rõ ràng. Có những trang web lớn sử dụng thẻ này bởi vì nó rất dễ đọc và chính xác.

• "Nó không được hỗ trợ trong HTML5"
  Thật ra đây là một trong nhữngthẻ được hỗ trợ rộng rãi nhất.

• "Đó là oldschool"
  Dây giày cũng là oldschool. Phương pháp mới không làm mất hiệu lực cái cũ. Bạn muốn cảm thấy tiến bộ và hiện đại: tốt. Nhưng đừng biến nó thành luật.

• "Thật ngu ngốc / vụng về / khập khiễng / kể một câu chuyện về bạn"
  Không ai trong số này. Nó giống như một cái búa: một công cụ cho một công việc cụ thể. Có các công cụ khác cho cùng một công việc và các công việc khác cho cùng một công cụ; nhưng nó được tạo ra để giải quyết một vấn đề nào đó và vấn đề đó vẫn còn đó nên chúng tôi có thể sử dụng một giải pháp chuyên dụng.

• "Bạn không nên làm điều này, bởi vì, CSS" Việc định
  tâm hoàn toàn có thể đạt được bằng CSS nhưng đó chỉ là một cách, không phải là cách duy nhất, chứ đừng nói đến cách duy nhất thích hợp . Bất cứ điều gì được hỗ trợ, làm việc và có thể đọc được đều được sử dụng.

TL; DR:

Lý do duy nhất để không sử dụng <center>là vì mọi người sẽ ghét bạn.