最近在用muse-ui這個UI框架，發(fā)現(xiàn)對新人上手并不友好，其中的坑還是很多的。想要修改其中的默認樣式很是頭疼。

網(wǎng)上也搜了很多樣式并沒有找到相似的，寫下這篇文章為需要的同志復(fù)用，也方便我自己日后可查。

廢話不多說現(xiàn)在開始：

首先Tabs組件默認的樣式是這樣的，發(fā)現(xiàn)他是豎向顯示并沒有橫向顯示。官網(wǎng)可查，鏈接地址奉上https://muse-ui.org/#/zh-CN/tabs

現(xiàn)在我要實現(xiàn)的效果是這樣的：

先看一下它官網(wǎng)的dome結(jié)構(gòu)：

知道了哪些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;

}

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

具體的添加樣式和數(shù)據(jù)根據(jù)自己業(yè)務(wù)來添加更改。