html:(12):pre和ul-li
使用<pre>標(biāo)簽為你的網(wǎng)頁加入大段代碼
在上節(jié)中介紹加入一行代碼的標(biāo)簽為<code>，但是在大多數(shù)情況下是需要加入大段代碼的，如下圖：
怎么辦？不會是每一代碼都加入一個(gè)<code>標(biāo)簽吧，沒有這么復(fù)雜，這時(shí)候就可以使用<pre>標(biāo)簽。
語法：
<pre>語言代碼段</pre>
<pre> 標(biāo)簽的主要作用:預(yù)格式化的文本。被包圍在 pre 元素中的文本通常會保留空格和換行符。
如下代碼：
<pre>var message="歡迎";for(var i=1;i<=10;i++){alert(message);} </pre>在瀏覽器中的顯示結(jié)果為：
在上面的例子中可以看到代碼中的空格，換行符都保留下來。如果用以前的方法，回車需要輸入<br>簽，空格需要輸入
注意：<pre> 標(biāo)簽不只是為顯示計(jì)算機(jī)的源代碼時(shí)用的，在你需要在網(wǎng)頁中預(yù)顯示格式時(shí)都可以使用它，只是<pre>標(biāo)簽的一個(gè)常見應(yīng)用就是用來展示計(jì)算機(jī)的源代碼。
<!DOCTYPE HTML> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>pre標(biāo)簽的使用</title> </head><body><pre> var message="歡迎"; for(var i=1;i<=10;i++)<br> {<br>alert(message); <br> }<br></pre> </body> </html>運(yùn)行結(jié)果
使用ul，添加新聞信息列表
在瀏覽網(wǎng)頁時(shí)，你會發(fā)現(xiàn)網(wǎng)頁上有很多信息的列表，如新聞列表、圖片列表，如下圖所示。
新聞列表
圖片列表
這些列表就可以使用ul-li標(biāo)簽來完成。ul-li是沒有前后順序的信息列表。
語法：
<ul><li>信息</li><li>信息</li>...... </ul>舉例：
<ul><li>精彩少年</li><li>美麗突然出現(xiàn)</li><li>觸動心靈的旋律</li> </ul>ul-li在網(wǎng)頁中顯示的默認(rèn)樣式一般為：每項(xiàng)li前都自帶一個(gè)圓點(diǎn)，如下圖所示：
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title> p標(biāo)簽</title> </head> <body> <ul><li>我的第一個(gè)列表信息</li></ul></body> </html>運(yùn)行結(jié)果
總結(jié)
以上是生活随笔為你收集整理的html:(12):pre和ul-li的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： windows重装系统或者苹果重装系统
- 下一篇： Dubbo开源