HTML 4.01 快速導覽 - 段落文字 <p>

<p> 為區塊元素 (block element) ,標記的文字會顯示成區塊 (block) ,如同段落一般。



起始標籤結束標籤
需要需要


<p> 有幾個屬性
屬性Deprecated or Obsolete
alignleft
center
right
justify
HTML 4 only, Obsolete in HTML 5


舉例如下
<html>
<head>
<title>網頁標題</title>
</head>
<body>
<p>You ever have that feeling where you're not sure if 
you're awake or still dreaming?</p>
<p>A prison for your mind.</p>
<p>Free your mind.</p>
<p>Believe the unbelievable.</p>
<p>There is no spoon.</p>
<p>I can only show you the door, you have to walk 
through it.</p>
<p>Choice. The problem is choice.</p>
Then tomorrow we may all be dead, but how would that 
be different from any other day?
I have dreamed a dream, but now that dream has gone 
from me.
Choice is an illusion, created between those with 
power, and those without.
Because I choose to.
Everything that has a beginning has an end.
</body>
</html>

<!-- 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:textexample30.html
     功能:示範 HTML 4.01 標記語言的使用 
     作者:張凱慶
     時間:西元 2011 年 5 月 -->


利用瀏覽器 (broswer) 開啟,結果如下



我們可以看到使用 <p> 標記的文字都是獨立的段落,每個 <p> 元素 (element) 與其它元素都有間隔一行,沒有用 <p> 標記的文字則是統統擠在一起。


另有一個與 <p> 具有類似功能的 <div> 標籤,兩者比較如下
<html>
<head>
<title>網頁標題</title>
</head>
<body>
<p>You ever have that feeling where you're not sure if 
you're awake or still dreaming?</p>
<p>A prison for your mind.</p>
<p>Free your mind.</p>
<p>Believe the unbelievable.</p>
<p>There is no spoon.</p>
<p>I can only show you the door, you have to walk 
through it.</p>
<p>Choice. The problem is choice.</p>
<div>Then tomorrow we may all be dead, but how would that 
be different from any other day?</div>
<div>I have dreamed a dream, but now that dream has gone 
from me.</div>
<div>Choice is an illusion, created between those with 
power, and those without.</div>
<div>Because I choose to.</div>
<div>Everything that has a beginning has an end.</div>
</body>
</html>

<!-- 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:textexample31.html
     功能:示範 HTML 4.01 標記語言的使用 
     作者:張凱慶
     時間:西元 2011 年 5 月 -->


同樣用瀏覽器開啟,如下



這裡, <div> 並沒有像 <p> 一樣與其它元素間有間隔一行,但 <div> 本身自成一個區塊,因此可以看到每一個英文句子都是獨立的一行。


中英文術語對照
區塊元素block element
區塊block
瀏覽器broswer
標籤tag


您可以繼續參考



相關目錄
HTML 4.01 快速導覽 - 目錄
HTML, CSS 教材
首頁


參考資料

沒有留言: