pure制作響應(yīng)式布局網(wǎng)頁，源碼我傳到群614199665了

知識(shí)要點(diǎn)

隨著移動(dòng)端的興起，網(wǎng)頁響應(yīng)式布局已不是什么新鮮事了，即頁面的結(jié)構(gòu)可以根據(jù)設(shè)備的寬度的不同而展現(xiàn)不同的效果，使得用戶的觀感和用戶體驗(yàn)更好。而做響應(yīng)式布局可能大家接觸比較多的就是Bootstrap，Bootstrap確實(shí)是一款很優(yōu)秀的前端框架，而且應(yīng)用非常廣，但是如果只是為了做響應(yīng)式布局的話，真的是"殺雞焉用牛刀"，為什么呢？因?yàn)閎oostrtap的壓縮版也有362kb，而今天給大家介紹的這款css組件：pure，只有多大呢？3.7kb，在流量為王的時(shí)代，在響應(yīng)式布局這塊，pure的性能速度簡(jiǎn)直狠甩bootstrap一大條街。那pure怎么使用呢？ 用法其實(shí)和bootstrap差不多：

step 1:

將 Pure 引入你的頁面

step 2:

添加 Viewport Meta 元素

step 3:

引入響應(yīng)式布局相關(guān)css

step 4：

根據(jù)需求按照pure的標(biāo)準(zhǔn)寫不同的class

Eg：