HTML 指導—- 字體效果和顏色
HTML Tutorial - Font Effects and Color
October 22nd, 2007 by sanriotown_moderator:hellokitty.com
I’m pretty sure many of you have been asking why there is a "code" tab when you start writing a new post. That tab enables you to enter HTML code, the thing that web designers use to make websites and how they want it to look like. I know it sounds geeky and nerdy but once you get the hang of it you will be able to customize your post more than just typing on the WYSIWYG editor.
很多人一定曾問過,當開始編寫一篇新的日志時,為何編輯頁面有著一個“編碼(code)”鍵。此按鍵其實是讓您進入HTML編輯的,其原本是網頁設計人員用來設計網頁的。我明白這些聽起來有點煩人,但是一旦您掌握了它的用法,您就能使您的日志比起僅僅利用“所見即所得”(WYSIWYG)編輯更加個性化。
Let’s start with something simple. Editing the way you want the text to look like. Here are a few codes you might want to use for some text effects by using these tags:
讓我們由簡單的開始,按照您想要的方式編寫文章。以下為一些您可以用來制造文字效果的編碼:
<u>Underline</u> - Underline
<b>Bold</b> - Bold
<i>Italic</i> - Italic
As you can see those effects simply place an underline, make your text bold or italic. You can also combine them all at once.
正如您看到的,這些效果可以幫助您的文字加入下劃線,變粗或是變為斜體。您也可以一次同時使用這三種效果。
<u><b><i>All Three!</i></b></u> - All Three!
Next you can add color to your text like what Rei has done on her’s:
接下來,您可以利用編碼將您寫的文字改變顏色,下面就是Rei在她的網誌志裏的字體顏色:
To do this you must add a new tag to your font to show this color. To do this you simply need to add the following tags:
想要改變文字的顏色,您必須為字體附加新的標簽。以下幾個例子說明了改變字體顏色需要如何加標簽:
<font color="red">Red</font> - Red
<font color="blue">Blue</font> - Blue
<font color="green">Green</font> - Green
Another thing that you have to remember is that you need to close all your tags when you start them. If you leave them open say like a <font color="red"> tag everything after that tag will turn into red. You need to close it with </font>. This goes for other tags as well so remember to close them tags!
另外,您需要記住的是當您開始寫標簽編碼時千萬別忘了結尾的字符。因為如果您的編碼沒有收尾,就像<font color="red">,則此後的所有文字都會成為紅色,而進行收尾就應在其後面加</font>的字符。其它的顏色標簽編碼也同樣需要收尾,所以在編寫時您別忘了收尾喔!
Stay tuned for my next tutorial about images, linking and paragraphs!
好了,今日的指導講完,記得來看下一集關於圖片、鏈接與文章的指導!
Technorati Tags: blog tutorial , html tutorial , html
