需求：实现多个元素一行内显示，且处在不同的位置
先上最终的结果图：
代码如下：
<div>
<p>最新执行记录</p>
<bk-button></bk-button>
</div>
给外层的div添加属性display: flex;和align-items: center;内容弹性布局，且居中显示，
效果
这里需要第二个元素向右浮动，则给bk-button这个元素添加属性margin-left:auto;
效果
最终代码：
<div style="font-size: 14px; padding-bottom: 20px; display: flex; align-items: center;">
<p>最新执行记录</p>
<bk-button
style="margin-left: auto;"
:theme="'primary'"
title="refesh"
icon="bk-icon icon-refresh"
@click="refeshClick"
class="mr10"></bk-button>
</div>
这里顺便说一下display为flex和inline-flex的区别
display: flex 将对象作为弹性伸缩盒显示
display: inline-flex 将对象作为内联块级弹性伸缩盒显示
flex效果如下
虽然没有为父元素设置宽度，但父元素的宽度为100%，而高度则是由子元素撑开，既高度自适应
inline-flex效果如下
没有为父元素设置宽度, 父元素的宽度会根据子元素而自适应，高度也是由子元素撑开，自适应