HTML中的段落文本如何換行?一篇文章告訴你換列標籤br的用法

來源:互聯網
上載者:User
本篇文章主要為大家講解了關於HTML段落文本換行的br標籤的用法,在一個段落中,正確的換行能使頁面更美觀。接下來讓我們一起看看這篇關於html 段落文本換行的文章吧

首先我們先看看段落文本換行的方法:

網頁中的段落通常都是用<p>標籤來表示的,那麼在一個p標籤裡面的文本在瀏覽器中都會以一段顯示,除非瀏覽器的架構不夠,不然都是以一行顯示的,只有架構不夠的時候才會自動的換行,但是我們如果想要手動給裡面換行可以嗎?事實當然是不行的,你在代碼中的換行在瀏覽器看來和沒動一樣,最多多了一點的空格而已。所以現在要用到的就是我們本篇文章所說的br標籤的用處了。

<br>標籤是一個單標籤,br就是用來給文本換行顯示的,讓瀏覽器識別的。

所以,現在我們看段代碼:

<!doctype html><html><head><meta charset="utf-8"><title>topic.alibabacloud.com</title></head><body><p>這裡是topic.alibabacloud.com,有著最全的線上教學的課程,包含了全部的編程學科,讓你們能學到更多的東西。這裡是topic.alibabacloud.com,有著最全的線上教學的課程,包含了全部的編程學科,讓你們能學到更多的東西。這裡是topic.alibabacloud.com,有著最全的線上教學的課程,包含了全部的編程學科,讓你們能學到更多的東西。這裡是topic.alibabacloud.com,有著最全的線上教學的課程,包含了全部的編程學科,讓你們能學到更多的東西。</p></body></html>

這裡面是一個段落,看看效果:

都是因為瀏覽器的視窗小了。所以顯示的行數多了,這是是不是很亂。但是我們要的是讓文本在哪一個字後面就不要顯示了,出現在下一行中顯示。(想看更多就來:html線上視頻教程)

現在我們加上<br>標籤看看效果:

<body><p>這裡是topic.alibabacloud.com,有著最全的線上教學的課程,包含了全部的編程學科,讓你們能學到更多的東西。</br>這裡是topic.alibabacloud.com,有著最全的線上教學的課程,包含了全部的編程學科,讓你們能學到更多的東西。</br>這裡是topic.alibabacloud.com,有著最全的線上教學的課程,包含了全部的編程學科,讓你們能學到更多的東西。</br>這裡是topic.alibabacloud.com,有著最全的線上教學的課程,包含了全部的編程學科,讓你們能學到更多的東西。</p></body>

看上面的代碼,我在裡面放了三個br標籤,看看效果:

是不是感覺瞬間就清晰了很多啊。這就是br標籤的用法了。我們通常都是把br標籤放在自己要想換行的地方,這樣才能起到作用,不然亂放或者不放的話都是對這個文本顯示不美觀,我們可以用br標籤來調節這個文本的格式化。

好了,本篇關於HTML段落文本換行的文章到這裡就結束了,如果有問題的可以在下方提問。

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.