\n trong html là gì?

Question

Phần tử HTML


    Hello, I am
    trying to create a
    new line

9 tạo ngắt dòng trong văn bản (xuống dòng). Nó rất hữu ích để viết một bài thơ hoặc một địa chỉ, trong đó việc phân chia các dòng là quan trọng

Nội dung chính Show

Thuộc tính
Thuộc tính không dùng nữa
Tạo kiểu với CSS
Đơn giản thôi
Mối quan tâm về khả năng tiếp cận
Tóm tắt kỹ thuật
Cách thêm ngắt dòng trong HTML
Kết luận
Ngắt dòng \n là gì?
\n trong JavaScript là gì?

Thử nó

Như bạn có thể thấy từ ví dụ trên, một phần tử


    Hello, I am
    trying to create a
    new line

9 được bao gồm tại mỗi điểm mà chúng tôi muốn ngắt văn bản. Văn bản sau


    Hello, I am
    trying to create a
    new line

9 bắt đầu lại ở đầu dòng tiếp theo của khối văn bản

Ghi chú. Không sử dụng


    Hello, I am
    trying to create a
    new line

9 để tạo lề giữa các đoạn văn;

Thuộc tính

Các thuộc tính của phần tử này bao gồm các thuộc tính toàn cục

Thuộc tính không dùng nữa

Hello, I am trying to create a new line

5 Không dùng nữa

Cho biết vị trí bắt đầu dòng tiếp theo sau dấu ngắt

Tạo kiểu với CSS

Phần tử


    Hello, I am
    trying to create a
    new line

9 có một mục đích duy nhất, được xác định rõ — để tạo ngắt dòng trong một khối văn bản. Như vậy, nó không có kích thước hoặc đầu ra trực quan của riêng nó và bạn có thể làm rất ít để tạo kiểu cho nó

Bạn có thể tự đặt

Hello, I am trying to create a new line

4 trên các phần tử


    Hello, I am
    trying to create a
    new line

9 để tăng khoảng cách giữa các dòng văn bản trong khối, nhưng đây là một cách làm không tốt — bạn nên sử dụng thuộc tính


    Hello, I am
    trying to create a
    new line

91 được thiết kế cho mục đích đó

ví dụ

Đơn giản thôi

Trong ví dụ sau, chúng tôi sử dụng các phần tử


    Hello, I am
    trying to create a
    new line

9 để tạo ngắt dòng giữa các dòng khác nhau của địa chỉ bưu chính

Mozilla<br />
331 E. Evelyn Avenue<br />
Mountain View, CA<br />
94041<br />
USA<br />

Kết quả trông giống như vậy

Mối quan tâm về khả năng tiếp cận

Tạo các đoạn văn bản riêng biệt bằng cách sử dụng


    Hello, I am
    trying to create a
    new line

9 không chỉ là một cách làm tồi mà còn là vấn đề đối với những người điều hướng với sự trợ giúp của công nghệ đọc màn hình. Trình đọc màn hình có thể thông báo về sự hiện diện của phần tử, nhưng không phải bất kỳ nội dung nào có trong


    Hello, I am
    trying to create a
    new line

9s. Đây có thể là một trải nghiệm khó hiểu và bực bội đối với người sử dụng trình đọc màn hình

Sử dụng các phần tử

Hello, I am trying to create a new line

3 và sử dụng các thuộc tính CSS như

Hello, I am trying to create a new line

4 để kiểm soát khoảng cách của chúng

Tóm tắt kỹ thuật

Thể loại nội dung Nội dung dòng chảy, nội dung cụm từ. Nội dung được phép Không có; . Bỏ qua thẻ Phải có thẻ bắt đầu và không được có thẻ kết thúc. Trong tài liệu XHTML, hãy viết phần tử này là


    Hello, I am
    trying to create a
    new line

97. Cha mẹ được phépBất kỳ phần tử nào chấp nhận nội dung cụm từ. Vai trò ARIA ngầm định Không có vai trò tương ứng Vai trò ARIA được phép


    Hello, I am
    trying to create a
    new line

98,


    Hello, I am
    trying to create a
    new line

99Giao diện DOM


    Hello, I am
    trying to create a
    new line

90

Trình duyệt web tự động ngắt văn bản xuống dòng tiếp theo khi dòng hiện tại đến phía bên phải của trình duyệt. Khi bạn thêm dấu ngắt dòng trong HTML, bạn tránh ngắt dòng văn bản này và bắt đầu văn bản mới ở dòng tiếp theo. Để thêm ngắt dòng vào mã HTML của bạn, bạn sử dụng thẻ
. Thẻ
không có thẻ kết thúc. Bạn cũng có thể thêm các dòng bổ sung giữa các đoạn bằng cách sử dụng thẻ
. Mỗi thẻ
bạn nhập sẽ tạo một dòng trống khác.

Ngắt dòng, đúng như tên gọi, là ngắt dòng 😅. Ngắt dòng trong HTML là điểm mà một dòng kết thúc theo chiều ngang và dòng tiếp theo bắt đầu trên một dòng mới

Trong HTML, khi bạn viết một chuỗi như thế này


    Hello, I am
    trying to create a
    new line

Khoảng trắng (khoảng trống tab trước "Xin chào", khoảng cách giữa "am" và "trying", "a" và "new") sẽ bị bỏ qua. Kết quả trên màn hình sẽ hiện ra như thế này

Hello, I am trying to create a new line

Một cách để khắc phục điều này (dù không hiệu quả lắm) là tạo ba thẻ

Hello, I am trying to create a new line

3 như thế này

Hello, I am
trying to create a
new line

Điều này sẽ dẫn đến kết quả như sau

Hello, I am
trying to create a
new line

Bởi vì các thẻ

Hello, I am
trying to create a
new line

0 tạo ra các phần tử

Hello, I am trying to create a new line

0, chúng chiếm toàn bộ không gian theo chiều ngang và phần tử tiếp theo sẽ chuyển sang dòng tiếp theo – như bạn có thể thấy từ kết quả ở trên

Giải pháp này không hiệu quả vì bạn đã tạo ba đoạn văn. Trong trường hợp trình đọc màn hình diễn giải điều này, nó sẽ đọc thành ba đoạn văn thay vì một câu. Điều này có thể ảnh hưởng đến khả năng truy cập web

Vậy làm cách nào để bạn thêm ngắt dòng cho phần tử nội tuyến?

Cách thêm ngắt dòng trong HTML

HTML có các thẻ cho nhiều mục đích, kể cả để tạo ngắt dòng. Bạn có thể sử dụng thẻ

Hello, I am trying to create a new line

1 trong HTML để thêm ngắt dòng. Nó có thể đi giữa các phần tử nội tuyến để chia các phần tử thành nhiều phần

Đây là một ví dụ về đoạn văn có thẻ

Hello, I am trying to create a new line

1

________số 8

Thẻ

Hello, I am trying to create a new line

1 là phần tử void không có thẻ đóng. Thay vào đó, nó là một thẻ tự đóng

Đoạn mã trên dẫn đến điều này

Hello, I am
trying to create a
new line

Bạn có thể sử dụng thẻ này cho các dạng phần tử nội tuyến khác như liên kết. Ví dụ, nhìn vào mã này


    Hello, I am
    trying to create a
    new line

1

Các thẻ neo,

Hello, I am trying to create a new line

4, là các phần tử nội tuyến, vì vậy thay vì liên kết thứ hai hiển thị trên dòng tiếp theo, nó sẽ hiển thị trong cùng một dòng như thế này

Bạn có thể sử dụng thẻ

Hello, I am trying to create a new line

1 giữa các liên kết để ngắt dòng liên kết đầu tiên


    Hello, I am
    trying to create a
    new line

4

Kết luận

Thẻ

Hello, I am trying to create a new line

1 trong HTML bắt đầu phần tử tiếp theo trên một dòng mới, tương tự như dấu xuống dòng

Hello, I am trying to create a new line

7 trong chuỗi

Thay vì sử dụng các phần tử khối để đặt các phần tử vào dòng mới, bạn có thể sử dụng thẻ ngắt dòng.

Hello, I am trying to create a new line

1

Trong các trường hợp như câu, việc sử dụng thẻ

Hello, I am trying to create a new line

1 đóng vai trò ngắt dòng trực quan và không ảnh hưởng đến khả năng truy cập. Trình đọc màn hình sẽ đọc câu không ngừng nghỉ

QUẢNG CÁO

Dillion Megida

Người ủng hộ nhà phát triển và Người sáng tạo nội dung đam mê chia sẻ kiến thức của tôi về Công nghệ. Tôi dạy JavaScript / ReactJS / NodeJS / React Frameworks / TypeScript / et al

Nếu bạn đọc đến đây, hãy tweet cho tác giả để cho họ thấy bạn quan tâm. Tweet một lời cảm ơn

Học cách viết mã miễn phí. Chương trình giảng dạy mã nguồn mở của freeCodeCamp đã giúp hơn 40.000 người có được việc làm với tư cách là nhà phát triển. Bắt đầu

Ngắt dòng \n là gì?

Nhưng \n chính xác là gì? . Điều này dẫn đến một dòng mới. an escape sequence, and it forces the cursor to change its position to the beginning of the next line on the screen. This results in a new line.

\n trong JavaScript là gì?

Ký tự dòng mới là \n trong JavaScript và nhiều ngôn ngữ khác. Tất cả những gì bạn cần làm là thêm ký tự \n bất cứ khi nào bạn yêu cầu ngắt dòng để thêm một dòng mới vào chuỗi.

programming html

\n trong html là gì?

Thử nó

Thuộc tính

Thuộc tính không dùng nữa

Tạo kiểu với CSS

ví dụ

Đơn giản thôi

Mối quan tâm về khả năng tiếp cận

Tóm tắt kỹ thuật

Cách thêm ngắt dòng trong HTML

Kết luận

Ngắt dòng \n là gì?

\n trong JavaScript là gì?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội