Uikit筆記(二)

此篇為關於 uk-grid 的應用。

也就是"手機上如何顯示 uk-grid 堆疊方式"。

原因...
因為這兩天發現了手機上的排版(有 uk-grid的)變得很迷你，
但一開始的方向有點不明朗，
一直在不知道是Thumbnav還是Grid的語法問題，
然後又進階看到Flex和Utility，結果和這沒關係(直到現在我還不太清楚這是要做啥)

解決...
就因對CSS不甚了解，只知道放上去，不知道排列是否有誤，所以又得請教子敖兄。
來回用Line修改解釋了一番後，
終於得到以下結論

官網頁於此http://getuikit.com/docs/grid.html
最底下的

Responsive width

UIkit also provides responsive grid width classes. You can apply these to maintain evenly sized grid columns, regardless of the device width.

Markup

<ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-5">
    <li>...</li>
    <li>...</li>
</ul>

讓我們來看一下這一段

<ul class="uk-grid uk-grid-width-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-5">

會發現中間出現了medium和large的不同，
也就是uk-grid-width-1-2適合小螢幕、uk-grid-width-medium-1-3適合中螢幕、uk-grid-width-large-1-5適合大螢幕。
當然想要設定出現幾欄是可以修改的。

感恩網海的浩瀚與友人的相助，又順利地挺過這個難關。

※以上為非專業人士筆記。XD