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
8 như thế nàyHello, 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
9 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ênGiả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
Hello, I am
trying to create a
new line
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
0Cá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àyBạ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ênHello, I am trying to create a new line
3Kế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ỗiThay 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
1Trong 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
QUẢNG CÁO
QUẢNG CÁO
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
ví dụ
Tham gia hai chuỗi
let text1 = "sea";
let text2 = "food";
let result = text1. concat[text2];
Tham gia hai chuỗi
let text1 = "Xin chào";
let text2 = "thế giới. ";
let result = text1. concat[" ", text2];
Thêm ví dụ bên dưới
Định nghĩa và cách sử dụng
Phương thức
Hello, I am
trying to create a
new line
0 nối hai hoặc nhiều chuỗiPhương thức
Hello, I am
trying to create a
new line
0 không thay đổi các chuỗi hiện cóPhương thức
Hello, I am
trying to create a
new line
0 trả về một chuỗi mớicú pháp
chuỗi. concat[chuỗi1, chuỗi2,. , chuỗiX]
Thông số
ParameterDescriptionstring1,string2,
.
stringXRequired.
Các chuỗi cần nối.
Giá trị trả về
TypeDescriptionMột chuỗiMột chuỗi mới chứa các chuỗi kết hợpThêm ví dụ
Tham gia ba chuỗi
let text1 = "Xin chào";
let text2 = "thế giới. ";
let text3 = "Chúc một ngày tốt lành. ";
let result = text1. concat[" ", text2, " ", text3];
Hỗ trợ trình duyệt
Hello, I am
trying to create a
new line
0 là một tính năng ECMAScript1 [ES1]ES1 [JavaScript 1997] được hỗ trợ đầy đủ trên mọi trình duyệt
ChromeEdgeFirefoxSafariOperaIECóCóCóCóCóCó