HTML font style 文字樣式設計

HTML font 文字的樣式(style)非常多樣化,例如粗體字(<strong> 或 <b>)、字型(font face)、顏色(font color)... 等,透過各種不同的文字屬性,可以很輕易的設計出各種風格優美的網頁文字,而且這些網頁文字的 style 都有相對應的 CSS 替代屬性,這裡透過表格整理一份常用到的 HTML font style 讓各位參考,如何搭配整體版型設計風格就請自行斟酌使用囉!

常用 HTML font style 樣式
font style
語法效果詳細用法
粗體字 1<b>粗體字 1</b>粗體字 1HTML font 粗體字設計
粗體字 2<strong>粗體字 2</strong>粗體字 2HTML font 粗體字設計
斜體字<I>斜體字</I>斜體字HTML font tag 文字標籤
文字加底線<u>文字加底線</u>文字加底線HTML font tag 文字標籤
新細明體<font face="新細明體">新細明體</font>新細明體HTML font face 網頁文字的字型
微軟正黑體<font face="微軟正黑體">微軟正黑體</font>微軟正黑體HTML font face 網頁文字的字型
標楷體<font face="標楷體">標楷體</font>標楷體HTML font face 網頁文字的字型
藍色的文字<font color="blue">藍色的文字</font>藍色的文字HTML font color 文字顏色設計
紅色的文字<font color="red">紅色的文字</font>紅色的文字HTML font color 文字顏色設計
綠色的文字
<font color="green">綠色的文字</font>綠色的文字HTML font color 文字顏色設計
很小的文字<font size="1">很小的文字</font>很小的文字HTML font size 網頁文字大小

HTML font style 應用範例一、修改文章內部份文字的 font style
這是一段文字<font color="red">這段文字要變成紅色</font>這是一段文字<font color="blue">這段文字要變成藍色</font><br>
這是一般文字<b>這段文字是粗體字</b>這是一般文字<br>
這是一般文字<u>這段文字有加底線</u>這是一般文字<br>
這是一般文字<font size="1">很小的文字</font>這是一般文
範例的視覺效果
這是一段文字這段文字要變成紅色這是一段文字這段文字要變成藍色
這是一般文字這段文字是粗體字這是一般文字
這是一般文字這段文字有加底線這是一般文字
這是一般文字很小的文字這是一般文
範例所呈現的是透過 font tag 或是直接使用 font style 樣式標籤去修改一串文字中的一小部份,HTML 大部份的功能標籤都有一個開頭標籤以及一個結尾標籤,只要在標籤之間的文字就會被修改,像範例中所呈現的這樣,以上就是常見的一些 HTML font style 實際效果,這些效果也幾乎都受到廣大主流瀏覽器的支援,少部份在新一代 HTML5 中有被建議使用 CSS 替代語法或直接由 CSS 相對應的替代語法所取代,詳情請參閱上表中的詳細用法。

更多網頁文字設計
© Copyright webtech.tw Since 2010