Divi Builder 無插件創建WordPress超級菜單
超級菜單允許用戶一次查看更多鏈接，而無需滾動、懸停和記住菜單內容。 使用內置Divi Mega菜單，在沒有插件的情況下向 Divi 添加超級菜單。
設置 WordPress菜單
在 Divi 中創建大型菜單首先要設置WordPress菜單。
這是默認情況下的外觀。父菜單項下有四個子菜單項。
添加超級菜單 CSS 類
將“mega-menu” CSS 類添加到每個父菜單中。
顯示樣式
子菜單外觀CSS樣式
/*edit the Divi mega menu*/
.et_pb_menu li.mega-menu ul {
選擇CSS樣式填入
}
參考樣式：
添加邊框：
border: 2px solid #2cba6c;
使角變圓：
border-radius: 10px;
調整間距：
padding: 0px;編輯超級菜單子菜單第一行
/*edit the Divi mega menu submenu first row*/
.et_pb_menu li.mega-menu > ul > li > a:first-child {
選擇CSS樣式填入
}
參考樣式：
添加邊框：
border-bottom: 2px solid #2cba6c;
更改背景大小：
background-color: #2cba6c;
更改文本顏色：
color: #ffffff;
更改文字大小：
font-size: 24px;
調整字體粗細：
font-weight: bold;
懸停時編輯超級菜單子菜單第一行
/*edit the Divi mega menu submenu first row on hover*/
.et_pb_menu li.mega-menu > ul > li > a:first-child:hover {
選擇CSS樣式填入
}
參考樣式：
添加邊框：
border-bottom: 2px solid #2cba6c;
更改背景大小：
background-color: #2cba6c;
更改文本顏色：
color: #ffffff;
更改文字大小：
font-size: 24px;
調整字體粗細：
font-weight: bold;
原創文章，作者：超哥，如若轉載，請註明出處：https://www.chaoneo.cn/zh-hant/archives/3478.html
如果您覺得超哥分享對您有所幫助的話，記得打賞給我😀