HTML 文字格式化

HTML可定義很多格式化輸出地元素.例如：粗體字斜體字文字方向等.而這些格式化的標籤可以從兩個方面進行劃分.

#依標籤功能可分為：

文字格式化標籤

#'電腦輸出'標籤

參考與術語定義標籤

依標籤功能的實作可以分為:

##基於內容的樣式標籤

基於物理樣式的標籤

#首先從標籤功能實作來看文字的格式化.

1. 基於內容的樣式標籤

#基於內容的樣式會告訴瀏覽器它所包含的文字具有特殊的意義.上下文或用法.然後瀏覽器就會把與該意義.上下文或用法一致的格式應用在文本上.

基於內容的樣式標籤有以下幾種:

1) < ;abbr>表示一個縮寫形式

2) <acronym>定義只取首字母的縮寫

3) <code>用來表示電腦原始碼或其它機器可以閱讀的代碼.。

4) <dfn>標記那些對特殊術語或片語的定義.

5) 告訴瀏覽器其所包含的文字為強調內容.

6) <kbd>表示要從鍵盤輸入的文字,瀏覽器使用等寬字體顯示該文字

7) 標籤和標籤一樣,表示對文字的強調.但是的語氣更為強烈些.

8) <var>表示變數名稱或由使用者提供的值.

基於內容的樣式,就是使用不同的字體,格式來顯示標籤所包圍的文字,都是有特殊的含義.如果僅僅是想產生不一樣的文字顯示效果,而沒有這些特殊的含義,最好不要使用這些標籤.例如: ;表示強調,其包含的文字顯示為粗黑體.但是,如果僅僅是想產生粗黑體的文字就不要使用標籤,可以使用標籤.

# 2. 基於物理樣式的標籤

基於內容的樣式告訴瀏覽器,這些標籤所代表了特殊的意義,依此能讓瀏覽器更好的現實文字.在特殊的時候,也許需要文字以特殊的方式來顯示,這就需要使用物理樣式.9種基於物理的樣式:粗體(bold)斜體<Italic)等寬(monospaced),下劃線(underlined),刪除線(strikethrough)放大(larger),縮小(smaller),上標(superscripted),下標(subscribed)

粗體

#大字體<big>

斜體

<s>刪除,不常用了,可以用<del>代替.

#小字型

<strike>底線

上標

下標

<tt>等寬字體.

功能實現上的劃分就到此了,再來看下從功能上的分類,由於有很多的標籤和上面的標籤重複,下面只詳細的介紹上面沒有的標籤.

文字格式化標籤.

標籤說明

# 定義粗字體

<big> 定義大字型

#<big> 定義大號字體

< ##; ；

# 定義下標

#<ins> 定義插入字.

<del> ,del代替

<strike> 不贊成使用,del代替.

##電腦輸出標籤

#標籤說明

#<code> 定義電腦程式碼。

<kbd> 定義鍵盤碼。

<samp> 定義電腦程式碼樣本。

<tt> 訂打字機代碼。

<var> 定義變數。

<pre> 定義預格式文字。

<listing> 不贊成使用。使用 <pre> 代替。

<plaintext> 不贊成使用。使用 <pre> 代替。

<xmp> 不贊成使用。使用 <pre> 代替。

引用、引用、術語定義

#標籤說明

######<abbr> 定義縮寫。 ######<acronym> 定義首字母縮寫。 ######<address> 定義位址。 ######<bdo> 定義文字方向。 ######<blockquote> 定義長的引用。 ######<q> 定義短的引文。 ######<cite> 定義引用、引證。 ###

<dfn> 定義一個定義項目。

實例：

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head> 
<body>

<b>This text is bold</b>  
  
<br />  
  
<strong>This text is strong</strong>  
  
<br />  
  
<big>This text is big</big>  
  
<br />  
  
<em>This text is emphasized</em>  
  
<br />  
  
<i>This text is italic</i>  
  
<br />  
  
<small>This text is small</small>  
  
<br />  
  
This text contains   
<sub>subscript</sub>  
  
<br />  
  
This text contains   
<sup>superscript</sup>  
  
</body>
</html>

實例2：

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head> 
<body>
<code>Computer code</code>  
<br />  
<kbd>Keyboard input</kbd>  
<br />  
<tt>Teletype text</tt>  
<br />  
<samp>Sample text</samp>  
<br />  
<var>Computer variable</var>  
<br />  
  
<p>  
<b>注释：</b>这些标签常用于显示计算机/编程代码。   
</p>  
  
</body>
</html>

繼續學習

新建檔案

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> 这个文本是加粗的 这个文本是加粗的 <big>这个文本字体放大</big> 这个文本是斜体的 这个文本是斜体的 这个文本是缩小的 这个文本包含 下标 这个文本包含 上标 </body> </html>

提交重置程式碼

自動運行