# 縮略圖導航/Thumbnav 創建可以使用 [Flex](flex.html) 進行對齊的彈性縮略圖導航。 ## 用法 要使用這個組件的話，就這樣做，添加 `.uk-thumbnav` 類到一個 `&lt;ul&gt;` 元素，然后將縮略圖嵌套在列表條目內部的 `&lt;a&gt;` 元素中。如果縮略圖導航比它的容器寬，并且使用了排水溝（gutter）時，添加 `.uk-active` 類創建active狀態。 要對齊子導航的話，比如使它水平居中，你可以使用 [Flex](flex.html)。 ### Example  ### Markup ``` <ul class="uk-thumbnav"> <li class="uk-active"><a href=""><img src="" alt=""></a></li> <li><a href=""><img src="" alt=""></a></li> </ul> ``` * * * ### 縮略圖導航與網格 你可以使用 [網格組件](grid.html) 中的 `.uk-grid-width-*` 類來實現在同一行中均勻地容納縮略圖導航條目。 #### Example  #### Markup ``` <ul class="uk-thumbnav uk-grid-width-1-5"> <li>...</li> </ul> ```