1. 建構遊戲界面
index.html：遊戲界面檔案
index.css：遊戲樣式檔案
main.js：遊戲主邏輯檔案
support.js：遊戲基本邏輯檔案
showanimation.js：遊戲動畫邏輯檔案
大家先把檔案按照這個結建構立好，名字自己命名也可以，但是index.html裡面也要跟着修改。
首先在index.html引入樣式檔案和邏輯檔案：
遊戲界面使用左中右布局，左邊是遊戲玩法說明區域，中間是遊戲區域，遊戲區域又使用上中下布局，上面是遊戲标題和分數，中間是遊戲視窗，下面是重新開始按鈕，右邊則是曆史記錄區域。
這裡樣式我們采用rem布局，來確定在如何pc端浏覽器都能正常顯示。
是以我們rem.js檔案需要添加内容：
讓我們開始最簡單的部分，直接上代碼。
index.html：
index.css：
運作index.html：
遊戲玩法說明區域就完成了。
然後我們開始做遊戲區域部分，先做上面的遊戲标題和分數。
儲存重新整理網頁：
這樣遊戲區域上部分就處于布局中上位置了。
然後就是中間的遊戲視窗，是個4×4的格子，是以我們用div包裹div來實作就行了。
？？？為什麼隻顯示了一個呢，按道理應該是十六個都顯示啊。為什麼會是這樣的呢，因為所有的div格子全部疊在一起了，下一章我會用js将棋盤初始化，那時候才能看到十六個格子。
接下來就是下面的重新開始按鈕了，我這邊不打算使用button來寫，而用a标簽來直接實作，利用a标簽的href來完成js方法的調用。
重新開始按鈕就做好了， newgame()方法留到後面再編寫。
終于到了最後一個部分了，那就是曆史記錄區域了，這個功能可以将每次的記錄儲存到浏覽器，隻保留前八名，隻要不清除網站資料，記錄就不會消失。
先完成最基本的樣式，後面有需要再添加。
這樣我們的遊戲界面就建構好了！