什麼是CSS。在之前的這篇文章中已經介紹了初步的介紹，詳細請看http://blog.csdn.net/u010955843/article/details/41791669。
DIv加CSS進一步講解了CSS中的內容，先總結如下圖：
其實在實際開發中，我們通常採用是外部樣式的匯入，這樣做的好處是對於很對有同樣設計樣式的頁面可以實現樣式的共用，這樣我們不僅僅可以節省了大量的時間，並且也方便我們可以靈活的調用的樣式。
Css樣式設計效果真的很神奇，我們來做幾個例子。 ² 導覽列的製作
<span style="font-family:KaiTi_GB2312;font-size:18px;"><strong><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>這是導覽列設定</title><style type="text/css">body{background-color:#FF99CC;}ul{font-family:"宋體";font-weight:bold;font-size:20px;}</style></head><body><ul><li><a href="#home">首頁</a></li><li><a href="#news">新聞</a></li><li><a href="#contact">聯絡</a></li><li><a href="#about">關於</a></li></ul></body></html></strong></span>
² 水平菜單的建立
<span style="font-family:KaiTi_GB2312;font-size:18px;"><strong><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><style type="text/css">ul{float:left;width:100%;padding:0;margin:0;list-style-type:none;}a{float:left;width:7em;text-decoration:none;color:white;background-color:purple;padding:0.2em 0.6em;border-right:1px solid white;}a:hover {background-color:#ff3300}li {display:inline}</style></head><body><ul><li><a href="#">Link one</a></li><li><a href="#">Link two</a></li><li><a href="#">Link three</a></li><li><a href="#">Link four</a></li></ul></body></html></strong></span>
這部分的學習關鍵在於多多實踐，CSS樣式很多，要想熟練掌握，那就要多多練。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
