GetUIKit按钮仅显示文本无外矩形边框，求解决方法

这问题出在版本不匹配上：你参考的是UIKit v2的文档，但实际引入的是v3版本的资源，两个版本的按钮样式类规则不一样。

两种解决办法任你选： #

1. 改用UIKit v2的资源（沿用你原有的类名写法）

把页面里引入的UIKit资源替换成v2版本的，这样uk-button类就会默认显示带边框的样式了：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 替换为UIKit 2.x的CDN资源 -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.5/css/uikit.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.5/js/uikit.min.js"></script>
</head>
<body>
    <a class="uk-button" href="">Link</a>
    <button class="uk-button" type="button">Button</button>
    <button class="uk-button" type="button" disabled>Disabled</button>
</body>
</html>

2. 适配UIKit v3的类名规则（保留v3资源）

在v3里，uk-button只是基础的按钮类，本身没有边框样式，需要搭配修饰类来实现你要的效果。比如用uk-button-outline来得到仅带边框的按钮，或者uk-button-default得到实心带边框的按钮：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.1.7/css/uikit.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.1.7/js/uikit.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.1.7/js/uikit-icons.min.js"></script>
</head>
<body>
    <!-- 使用v3的outline类实现带边框按钮 -->
    <a class="uk-button uk-button-outline" href="">Link</a>
    <button class="uk-button uk-button-outline" type="button">Button</button>
    <button class="uk-button uk-button-outline" type="button" disabled>Disabled</button>
</body>
</html>

简单说下原因：UIKit v2到v3有不少样式类的调整，v2里uk-button默认自带边框样式，但v3把基础样式和外观样式拆分了，基础类只负责按钮的布局行为，外观需要额外加修饰类来定义。

内容的提问来源于stack exchange，提问作者David Portabella