Hướng dẫn how do you code break in html? - làm thế nào để bạn ngắt mã trong html?

Làm thế nào để bạn viết một thẻ phá vỡ?

Trong HTML, một ngắt dòng được thực hiện với thẻ. Chúng tôi không cần phải đóng vì đó là một thẻ trống.

\ N trong html là gì?

Ký tự \ n phù hợp với các ký tự dòng mới.

Khi bạn đang viết HTML, bạn thường cần phải chèn các lần phá vỡ dòng. Việc phá vỡ dòng là rất cần thiết trong địa chỉ, bài thơ hoặc khi văn bản vượt quá chiều rộng trình duyệt có sẵn. Nếu bạn không chèn các lần ngắt dòng của riêng bạn, thì văn bản sẽ được định dạng theo một cách kỳ lạ.

Trong hướng dẫn này, tôi sẽ chỉ cho bạn cách chèn các lỗi dòng trong mã HTML của bạn với một số ví dụ "có và không có", để bạn có thể bắt đầu sử dụng nó một cách chính xác và định dạng văn bản của bạn tốt hơn.

Cú pháp phá vỡ dòng html cơ bản

Cách chèn các lần ngắt dòng trong địa chỉ

Một lần phá vỡ dòng rất quan trọng khi bạn viết một địa chỉ trên một chữ cái, ví dụ, để định dạng nó đúng cách.

Đây là một ví dụ về một địa chỉ không bị phá vỡ dòng

Một địa chỉ không bị phá vỡ dòng (thẻ
) trông như thế này:

     The White House, 1600 Pennsylvania Avenue NW Washington, DC 20500, USA.

Tôi đã thêm một số mã CSS để tập trung mọi thứ với FlexBox và làm cho văn bản lớn hơn một chút:

body {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    font-size: 3rem;
    max-width: 1000px;
    margin: 0 auto;
}

Đây là cách nó trông trong trình duyệt:

Đây là một địa chỉ với các lần phá vỡ dòng

Và đây là cách chúng tôi có thể thêm các lần ngắt dòng để định dạng địa chỉ của chúng tôi đúng cách:

    The White House 

    1600 Pennsylvania Avenue 

    NW Washington, DC 

    20500 

    USA

Có vẻ như thế này trong trình duyệt:

Cách thêm các đường ngắt cho các bài thơ

Những bài thơ được viết theo quy ước trong các câu phá vỡ ngắn để tạo ra hệ thống phân cấp thị giác và định dạng chúng một cách độc đáo.

Vì vậy, nếu bạn muốn viết một bài thơ trong mã HTML của mình, thẻ
giúp bạn dễ dàng hơn.

Một bài thơ không bị phá vỡ dòng

      I dabbled around a lot when I decided to learn to code 
      I went from A to Z with resources 
      When I decided to make my own things 
      I discovered I've been in the old all while 
      So I remained a novice in coding 
      But then I found freeCodeCamp 
      I got my hands on the platform 
      I went from novice to ninja in coding 
     And now I'm a camper for life

Có vẻ như thế này trong trình duyệt:

Cách thêm các đường ngắt cho các bài thơ

Những bài thơ được viết theo quy ước trong các câu phá vỡ ngắn để tạo ra hệ thống phân cấp thị giác và định dạng chúng một cách độc đáo.

      I dabbled around a lot when I decided to learn to code 

      I went from A to Z with resources 

      When I decided to make my own things 

      I discovered I've been in the old all while 

      So I remained a novice in coding 

      But then I found freeCodeCamp 

      I got my hands on the platform 

      I went from novice to ninja in coding 

      And now I'm a camper for life 

Vì vậy, nếu bạn muốn viết một bài thơ trong mã HTML của mình, thẻ
giúp bạn dễ dàng hơn.

body {
   display: flex;
   align-items: center;
   justify-content: center;
   height: 100vh;
   font-size: 2.5rem;
   max-width: 1000px;
   margin: 0 auto;
}

Một bài thơ không bị phá vỡ dòng

Bạn có thể thấy bài thơ không có hệ thống phân cấp trực quan, nó không được định dạng đúng cách, và vì vậy nó không thể đọc được như một bài thơ.

Một bài thơ với dòng phá vỡ Do not use the
tag to force a space between block-level elements (

body {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    font-size: 3rem;
    max-width: 1000px;
    margin: 0 auto;
}

body {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    font-size: 3rem;
    max-width: 1000px;
    margin: 0 auto;
}

body {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    font-size: 3rem;
    max-width: 1000px;
    margin: 0 auto;
}

    The White House 

    1600 Pennsylvania Avenue 

    NW Washington, DC 

    20500 

    USA

    The White House 

    1600 Pennsylvania Avenue 

    NW Washington, DC 

    20500 

    USA

Bạn có thể tự hỏi - vì thẻ
là một yếu tố, liệu có thể tạo kiểu cho nó không?

Vâng, nó là có thể.Nhưng không có nhu cầu thực tế để tạo kiểu cho nó vì tất cả những gì nó làm là tạo ra một vài không gian trắng.

Sự kết luận

Tôi hy vọng hướng dẫn này đã cung cấp cho bạn kiến thức nền tảng bạn cần sử dụng thẻ
để bạn có thể làm cho văn bản HTML của bạn trông tốt hơn.

Cảm ơn bạn đã đọc, và tiếp tục mã hóa.