相當逼真，css3果然強悍。
檢視例項：
來看下原作者的設計草圖：
簡明建立過程
第一步 ：建立如下選單結構
<
div
id="startmenu"
>
<
ul id
="programs"
>
<
li><
a href
="#"
><
img
src="firefox-32.png"
alt=""
/>
mozilla firefox
a>
li>
<
li><
a href
="#"
><
img
src="chrome.png"
alt=""
/>
google chrome
a>
li>
<
li><
a href
="#"
><
img
src="safari.png"
alt=""
/>
safari
a>
li>
<
li><
a href
="#"
><
img
src="opera.png"
alt=""
/>
opera
a>
li>
<
li><
a href
="#"
><
img
src="ie.png"
alt=""
/>
internet explorer
a>
li>
<
li><
a href
="#"
><
img
src="rss_32.png"
alt=""
/>
rss feeds
a>
li>
<
li><
a href
="#"
><
img
src="twitter_32.png"
alt=""
/>
a>
li>
<
li><
a href
="#"
><
img
src="delicious_32.png"
alt=""
/>
delicious
a>
li>
ul>
<
ul id
="links"
>
<
li class
="icon"
><
img
src="folder.png"
alt=""
/>
li>
<
li><
a href
="#"
><
span
>
documents
span
>
a>
li>
<
li><
a href
="#"
><
span
>
pictures
span
>
a>
li>
<
li><
a href
="#"
><
span
>
music
span
>
a>
li>
<
li><
a href
="#"
><
span
>
computer
span
>
a>
li>
<
li><
a href
="#"
><
span
>
network
span
>
a>
li>
<
li><
a href
="#"
><
span
>
connect to
span
>
a>
li>
ul>
div>
win7的開始選單有二個部分，左側程式選單，右側系統選單。
第二步：選單容器css
#startmenu
有幾個關注的點,可以留意下：
第三步：選單左側部分的css
#programs
#programs a
#programs a:hover
#programs a img
這裡值得留意的是滑鼠經過選單項的效果設定，也就是#programs a:hover裡的樣式，這是難點，也是css3的強大之處，依舊是圓角、陰影、漸變背景。
第四步：選單右側的css部分
#links
#links li.icon
#links a
#links a:hover
#links a span
#links a:hover span
要留意的點依舊是哪幾項，難點在於細節的微調，尤其是漸變背景的製作，css3中非常靈活，下次有機會，發篇css3漸變背景的詳細教程。
英文原文：
基於css3仿造window7的開始選單
相當逼真，css3果然強悍。友情提示 請勿在ie下瀏覽。來看下原作者的設計草圖 簡明建立過程 第一步 建立如下選單結構 複製 如下 程式設計客棧 div win7的開始選單有二個部分，左側程式選單，右側系統選單。第二步 選單容器css 複製 如下 www.cppcns.comstartmenu 有幾...
Window7系統安裝和使用MySql
解壓 mysql 設定mysql客戶端預設字符集 default character set utf8 mysqld 設定3306埠 port 3306 設定mysql的安裝目錄 basedir d mysql 5.7.13 winx64 設定mysql資料庫的資料的存放目錄 datadir c w...
Window7中軟連線的使用MkLink
應用場景 多個專案 或者同一專案不同分支 需要使用同一組依賴檔案時，我們希望只在其中乙個專案中提供原始檔案 而在其它專案中則通過類似linux中的軟連線的方式引入。最終既可以減少同一依賴檔案庫 乙個目錄中的所有庫 的多副本維護 必須保持統一 又可以降低對磁碟空間的占用。有乙個dependency的資...