如何增大R Shiny Dashboard侧边栏menuItem中图标与tabName的间距
R Shiny Dashboard侧边栏菜单图标与文字间距调整方案
你只需在现有自定义CSS中新增针对侧边栏菜单Font Awesome图标的右外边距规则即可实现需求,具体修改后的代码如下:
Dashboard_Sidebar <- dashboardSidebar(tags$head(tags$style(HTML(' /* Sidebar */ .skin-blue .main-sidebar { background-color: #d3bf96; font-size: 16px; font-family: "Roboto"; } /* 新增:调整菜单图标与文字的间距 */ .skin-blue .main-sidebar .sidebar-menu li a .fa { margin-right: 15px; /* 可自由调整数值,数值越大间距越大 */ } /* Sidebar other items */ .skin-blue .main-sidebar .sidebar a{ color: #000000; padding-left: 20px; } /* Sidebar when active/hover */ .skin-blue .main-sidebar .sidebar .sidebar-menu a:hover , .skin-blue .main-sidebar .sidebar .sidebar-menu .active a{ background-color: #000000; color: #ffffff; padding-top: 10px; padding-left: 20px; display: block; border-color: transparent; } '))), width = 250, sidebarMenu( menuItem("Introduction",tabName = "introduction", icon = icon("file-alt", "fa-lg fa-fw")) ))
补充说明
- 数值
15px可根据你的视觉需求随意调整,不需要改动其他代码 - 如果你需要单独调整某一个menuItem的间距,可以给对应menuItem添加自定义类,再写对应CSS规则即可
内容的提问来源于stack exchange,提问作者Nehau
相关产品推荐
相关产品推荐

