在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ element-ui navmenu 高度

element-ui navmenu 高度

在vue-cli下使用element-ui,
使用了其中的menu-sider-bar
https://element.eleme.io/#/en-US/component/menu#side-bar
但是其中列表的單行高度太高了,不知如何改低。
其中的子項(xiàng)可以通過修改el-menu-item的高度實(shí)現(xiàn),但是父項(xiàng)卻不知如何修改,
`

<el-submenu index="1">
    <template slot="title">
      <span> menu</span>
    </template>
    <el-menu-item class="sub-menu" index="1-1" >
      submenu
    </el-menu-item>
</el-submenu>

`
如上,submenu段可通過修改class="sub-menu"的css實(shí)現(xiàn),但是menu段不知如何實(shí)現(xiàn)(無法通過修改template的css實(shí)現(xiàn))。
經(jīng)運(yùn)行,生成的html中會(huì)有一段class="el-submenu__title"的div,其css中有height:56px;inline-height:56px;,將其取消之后高度變短,但是這個(gè)class僅在運(yùn)行后才會(huì)有,源代碼中沒有,而且在源碼中加入相關(guān)css也無作用。
不知如何更改其高度

回答
編輯回答
話寡

F12了一下,navmenu在html中實(shí)際如下:

clipboard.png

修改高度:

  1. 在ul中增加一個(gè)父級(jí)class,避免把全局navmenu樣式全給改了;
  2. 修改li的height和line-height:

clipboard.png

  1. 遇到我的工作臺(tái)這樣子選項(xiàng)的,接著修改它的li樣式:

clipboard.png

clipboard.png

  1. 如何修改:

clipboard.png

clipboard.png

可以嘗試一下這兩個(gè)地方添加自定義class,然后f12里改動(dòng);

2018年5月7日 07:52
編輯回答
尐潴豬

對(duì)于修改ElementUI的官方樣式,您可以參考下這個(gè)問題下我回答的。修改element樣式
對(duì)于你的問題,個(gè)人推薦第四種方式

2017年2月6日 08:08