UIkit3.x文档

标记

在图像上方创建一个标记图标。

用法

要应用此组件,请将uk-marker 属性添加到任何元素。 可以使用Position 组件将标记放置在图像的顶部。 还可以添加Utility 组件中的.uk-transform-center,将标记居中到其左上角。

<a href="" uk-marker></a>

Note 添加.uk-light 或者 .uk-dark class,可以对元素效果进行优化,使其在深色或浅色图像上具有更好的可见性。

  • <div class="uk-child-width-1-2" uk-grid>
        <div>
            <div class="uk-inline uk-dark">
                <img src="/skin/ukv3/images/light.jpg" alt="">
                <a class="uk-position-absolute uk-transform-center" style="left: 20%; top: 30%" href="#" uk-marker></a>
                <a class="uk-position-absolute uk-transform-center" style="left: 60%; top: 40%" href="#" uk-marker></a>
                <a class="uk-position-absolute uk-transform-center" style="left: 80%; top: 70%" href="#" uk-marker></a>
            </div>
        </div>
        <div>
            <div class="uk-inline uk-light">
                <img src="/skin/ukv3/images/dark.jpg" alt="">
                <a class="uk-position-absolute uk-transform-center" style="left: 20%; top: 30%" href="#" uk-marker></a>
                <a class="uk-position-absolute uk-transform-center" style="left: 60%; top: 40%" href="#" uk-marker></a>
                <a class="uk-position-absolute uk-transform-center" style="left: 80%; top: 70%" href="#" uk-marker></a>
            </div>
        </div>
    </div>