充分利用HTML標籤元素 – 簡單的xtyle前端架構

標籤：http   使用   strong   io   html   ar   div   htm   

xtyle架構充分利用語義化標籤來做美化樣式，相容多款主流瀏覽器，包括IE8。

xtyle架構雖然沒BS這麼強大，但我覺得也很實用，體積不算很大，適用於企業網站、WordPress主題、個人網站、部落格等方面的應用，當然手機端也是適用哦！

架構：xtyle

柵格系統（Layout）

柵格系統我想很多人是比較關注的，這個xtyle的柵格系統很簡單，也很實用和易用，柵格Class由.gird1-.grid10來控制。

布局簡單用法

一欄布局

直接使用class="gird1"即可。

<div class="grid3">列1</div>

三欄布局

<div class="grid3">欄1</div><div class="grid3">欄2</div><div class="grid3">欄3</div>

所以如果你要2欄，每欄的class就用grid2，如此類推，使用很簡單吧？

xtyle架構的一些元素樣式

xtyle架構的樣式我覺得很實用以及很齊全，語義化清晰，下面來自xtyle的一樣。

基本排版樣式

字型樣式

標題樣式

段落樣式

顏色

提示樣式

表單樣式

選項按鈕

多種按鈕樣式

傳送門：xtyle | xtyle github