vuejs怎样将checkbox样式设置为一排展示

开始拿到一个页面，页面是这样展示的：

这个展示的太不友好，现在希望将这个弄成一排展示，最后达到这样的效果：

因为前面已经设置了label样式，所以现在只需要根据id进行设置样式就行，之前的代码是这样的：

修改之后的代码为：

<style scoped>
#add-blog *{
    box-sizing: border-box;
}

#add-blog{
    margin: 20px auto;
    max-width: 600px;
    padding: 20px;
}

label{
    display: block;//表示每个label标签独占一行
    margin: 20px 0 10px;
}

input[type="text"],textarea,select{
    display: block;
    width: 100%;
    padding: 8px;
}

#checkboxes label{
    display: inline-block;//表示checkboxes里面每个label标签填充在一行
    margin-top: 0;
}
</style>