CSS

連結主頁&教學
HTML iframe 框架
HTML iframe 是框架的一種，也稱為內置框架或內聯框架，用來在網頁內嵌入另外一個網頁，例如現在非常流行的嵌入 Facebook 粉絲團到部落格或個人網站、在網站內容加上按讚或分享的按鈕都是常見的應用方式，HTML iframe 可以自己設定要嵌入的網頁所佔空間，如寬度與高度，也可以設定是否要顯示邊框或捲軸，幾乎所有主流的瀏覽器都支援 HTML iframe 框架語法。

HTML iframe 基本語法
<iframe src="要嵌入的網頁網址"></iframe>
標準的 HTML iframe 框架語法是由 <iframe> 開始至 </iframe> 結束，開頭的 <iframe> 標籤內的 src 就是用來指定要嵌入的網頁網址，如果想要寫得更完整一點，可以在 <iframe> 與 </iframe> 間加入＂瀏覽器不支援的提示文字＂，當網友使用的瀏覽器不支援 HTML iframe 時，可以顯示提示文字讓網友知道有一個部分的內容沒有顯示。

HTML iframe 框架寬度與高度設定
<iframe src="要嵌入的網頁網址" width="寬度" height="高度"></iframe>
如果要替 iframe 加上寬度與高度，僅需使用 width 與 height 這兩個屬性即可，預設的屬性單位為 px，例如「width="200" height="200"」這樣寫就代表寬度與高度均是 200px，但為了管理上的效率，還是建議寫成「width="200px" height="200px"」比較完整，若是要使用百分比做為尺寸的單位，則一定要將百分比寫出來，例如「width="30%" height="50%"」這樣，否則瀏覽器可能會誤以為是用 px 做為單位。

HTML iframe 框架邊框顯示與隱藏
<iframe src="要嵌入的網頁網址" frameborder="0"></iframe>
網頁設計本來的風格在嵌入另一個網頁後，很可能會對原本的視覺效果有所影響，其中突兀的邊框可以說是相當明顯，還好 iframe 有提供隱藏邊框的功能，範例中的 frameborder="0" 代表隱藏邊框，如果是 frameborder="1" 則代表顯示邊框。

HTML iframe 框架 scrolling 捲軸
<iframe src="要嵌入的網頁網址" scrolling="no"></iframe>
既然是嵌入另一個網頁，就很可能會遇到網頁大小與主網頁的顯示區塊間的尺寸差異，嵌入的網頁可能很大或是內容很多，需要用到捲軸才方便，iframe 可以透過 scrolling 屬性來設定是否要顯示捲軸，scrolling 有三個屬性值，分別為 yes 代表要顯示捲軸、no 代表不顯示捲軸以及 auto 代表根據網頁大小自動顯示。

屬性混搭使用
<iframe src="要嵌入的網頁網址" width="200" height="200" frameborder="0" scrolling="no"></iframe>
以上幾個常用的屬性，可以同時用在一個 iframe 框架的設計上，調整出最適合的嵌入尺寸與形態，假設全部屬性都用上去，寫起來大至會向範例這個模樣，意思代表要嵌入一個寬度與高度都是 200px 的框架，邊框與捲軸都不顯示。

關於 iframe 內容的另開新視窗方式
HTML iframe 是框架功能，目的僅為用來嵌入其他 URL 的內容，至於透過 iframe 嵌入進來的內容，若要讓網友可以用新視窗開啟，例如被嵌入至網頁或部落格的 Facebook 粉絲團，網友可以直接從網頁中的 Facebook粉絲團直接前往 Facebook 官方網站，這個決定權在＂被嵌入進來的網頁＂內的連結是否有使用「target="_blank"」屬性，也就是超連結的＂在新視窗開啟網頁＂屬性。

➤關於 iframe 另開新視窗的技巧，請閱讀以下這篇：frame 連結另外開啟新視窗或在原本網頁開啟。

Free Blogger 及 CSS 模板
Gemmy資訊農夫
on 2/05/2010 04:23:00 下午  資訊農夫 (山海醉客) ~部份參考自 免費資源網路社群 : http://www.freegroup.org/~
Free CSS Templates : http://www.freecsstemplates.org/

Free Layouts 堅持W3網頁標準規範，為了持續這個任務，網站也只接受符合網頁設計標準的佈景主題，也就是說使用者可以在這裡下載到一系列符合網頁標準的網站設計。
在網頁佈景部份，除了一般的HTML模板，也有Flash模板可以選擇，一點也不亞於付費的商業模板（Premium Templates）。如果你有使用 MySpace 或 Blogger ，Free Layouts 也提供了適當的模板，可完全支援這兩個平台的使用環境。Blogs Templates 部份也提供了 WordPress佈景主題（WordPress Themes）。
~ = =
Our Blogger Templates http://www.ourblogtemplates.com/
~ = =
BTemplates : http://btemplates.com/

BTemplates提供大量的免費Blogger範本，或稱作佈景主題（模板），目前共有超過 1,000 種以上設計精美的佈景主題，而本文也特別挑選10個相當好看Blogger範本。每個範本都有預覽圖、即時預覽功能，無須註冊也可以從 BTemplates 免費下載模板。

~~~~~~~~~~~~~~~~~

Blogger template下載酷站推薦 - 讓你Blogger範本抓不完及使用教學
bloggertemplatesfree : http://www.bloggertemplatesfree.com/
~~~~~~~~~~~~~~~~
精選10個絕不能錯過的Blogger模板網站= = = = = = = =

OpenDesigns 提供了大量的開放原始碼網站模板，這些都基於 XHTML 和 CSS 的網頁設計佈景，數量繁多，同時可以線上即時預覽（Live Preview），並可以免費下載。常常在製作網頁前不知道從何開始嗎？這時候不妨花個一、兩分鐘，到 OpenDesigns 網站逛逛吧，或許可以給你不少靈感。

在 OpenDesigns 首頁可以看到一些近期上架的免費網站佈景，點選右上角的 DESIGNS 可以瀏覽完整的佈景列表。
~ ~~~~~~~~~~~~~~~~~
Free CSS Templates 是國外一個提供免費CSS佈景的網站，目前共有超過數百種的CSS模版設計。每個佈景都有預覽圖與實際於瀏覽器上的顯示效果，並且提供.ZIP壓縮檔可直接下載使用。
~~~~~~~~~~~~~~~~~~~
ZeroWeb.org
國外的免費資源網站，提供網站模板免費下載，並且能夠線上預覽下載，網頁圖像素材則包含有按鈕、背景、Icon 等等，並有一些相關插圖可供使用，內容相當豐富。
此外，ZeroWeb.org 也有方便網站站長的服務，例如免費留言板、網站轉址與聯繫表單線上申請。
~~~~~~~~~~~~~~~~~~
WordPress Themes。
與一般佈景主題網站相同的是它也具備了預覽圖、Test 佈景主題的功能，此外還對於佈景主題的種類、顏色或是欄位數來詳細的分類，您也可以透過以最新佈景、最多人下載的佈景、評分最高的佈景等等方式來找尋適合您 WordPress部落格的佈景主題，完全免費！