# 缩略图导航/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> ```