修改 CSS DIV 內文字樣式

如果你想修改 CSS DIV 區塊內的文字樣式，可以透過 CSS 內建的 font-style 屬性來設計，這是一個文字樣式設計的標準屬性，幾乎所有主流的瀏覽器都支援，常見的文字樣式效果就是斜體字，這在傳統的 HTML 設計中，可以採用 <I></I> 標籤來處理，可是到了 CSS 就必須使用 font-style 屬性來修改，效果是一樣的。

如果你想修改的是 DIV 區塊內文字的字型，請參閱《修改 CSS DIV 內文字字型》篇的內容，因為修改字型與修改文字樣式是兩回事，如果你的確是要修改 DIV 區塊內文字樣式，請繼續看下去。

CSS font-style 屬性與法
font-style: 文字樣式特效;
CSS 的 font-style 屬性一次就只能設定一個樣式參數，有效果的就是斜體字，看範例吧！

修改 CSS DIV 區塊內文字樣式的實際範例
<div style="border:1px #ccc solid;font-style:normal;margin:15px 0px;">這個區塊內文字都是正體字</div>
<div style="border:1px #ccc solid;font-style:italic;margin:15px 0px;">這個區塊內文字都是斜體字</div>
範例所呈現的視覺效果
這個區塊內文字都是正體字
這個區塊內文字都是斜體字
如你所見，我們套用了 CSS font-style 屬性並設定了斜體字特效的參數，這樣就可以讓 DIV 區塊內的文字樣式出現斜體字效果，那如果我們今天只要把 DIV 區塊內的少部分特定文字設為斜體字又該怎麼做呢？這時候我們可以使用 span 區域標籤，把特定文字標示起來，再套用 font-style 屬性，我們用下面這個範例來呈現。

DIV 區塊內特定文字樣式修改範例
<div style="border:1px #ccc solid;font-style:normal;margin:15px 0px;">
這個區塊內文字預設是正體字<span style="font-style:italic;">這段文字是斜體字</span>這個區塊內文字預設是正體字
</div>
範例呈現的效果
這個區塊內文字預設是正體字這段文字是斜體字這個區塊內文字預設是正體字
我們可以從範例很清楚看到，只有用 span 區域標籤所標示起來的文字有文字樣式的效果，也就是斜體字效果，其他的部分還是維持著正體字，用這樣的技巧可以修改 DIV 區塊內任意文字的樣式。

延伸閱讀
© Copyright webtech.tw Since 2010