CSS font-family 屬性基本語法
font-family: 順位第一的字型,順位第二的字型,順位第三的字型, ... 以此類推;
CSS 的 font-family 屬性允許設計師一次填入多個不同的文字字型,瀏覽器會根據順序挑選能夠顯示的字形,假設第一個字型就能顯示,後面的字型就不會用到,如果第一個字型無法顯示,瀏覽器就會在 font-family 屬性中挑出順序第二的字型看看能不能顯示,以此類推,關於 CSS 的 font-family 屬性的詳細用法,請參閱:CSS font-family 字型。利用 font-family 屬性修改 span 區域內的文字字型樣式
<span style="font-family:serif;border:1px orange solid;margin-right:5px;">這是 serif 字型的文字</span>
<span style="font-family:sans-serif;border:1px orange solid;margin-right:5px;">這是 sans-serif 字型的文字</span>
<span style="font-family:DFKai-sb;border:1px orange solid;margin-right:5px;">這是標楷體字型的文字</span>
範例的實際效果<span style="font-family:sans-serif;border:1px orange solid;margin-right:5px;">這是 sans-serif 字型的文字</span>
<span style="font-family:DFKai-sb;border:1px orange solid;margin-right:5px;">這是標楷體字型的文字</span>
這是 serif 字型的文字 這是 sans-serif 字型的文字 這是標楷體字型的文字
範例中總共有三個不同的 span 區域,分別利用 font-family 屬性重新設計了它們的文字字型,從左而右分別是 serif 字型、sans-serif 字型以及標楷體,其中比較特別的是標楷體不一定能在非 Window 系列的作業系統中呈現,另外,範例中的 border 與 margin 分別是邊框與外距的設計屬性,用來設計 span 的邊框與彼此間的距離,讓範例看起來更清楚而已。更多 span 設計