Muse-ui中Tabs组件（修改它默认样式实现）点击左侧实现右

最近在用muse-ui这个UI框架，发现对新人上手并不友好，其中的坑还是很多的。想要修改其中的默认样式很是头疼。

网上也搜了很多样式并没有找到相似的，写下这篇文章为需要的同志复用，也方便我自己日后可查。

废话不多说现在开始：

首先Tabs组件默认的样式是这样的，发现他是竖向显示并没有横向显示。官网可查，链接地址奉上https://muse-ui.org/#/zh-CN/tabs

现在我要实现的效果是这样的：

先看一下它官网的dome结构：

知道了哪些class控制元素以后我们就来更改他们的默认样式。

贴上我修改后的代码：

.mu-tabs-center {

  float: left;

  width: 25%;

  -webkit-box-pack: center;

  flex-direction: column;

}

.demo-text {

  width: 400px;

  float: right;

  width: 75%;

  padding: 10px 0;

}

最后看一下修改后的效果：

具体的添加样式和数据根据自己业务来添加更改。