Zeilenabstand in R Shiny anpassen: eine Schritt-für-Schritt-Anleitung
P粉336536706
P粉336536706 2024-03-28 12:25:37
0
1
422

Ich versuche, die Lücken zwischen Zeilen in einem actionButton() anzupassen, das in einer Shiny-App gerendert wurde, wie unten gezeigt und basierend auf dem MWE-Code unten. Wie passt man den Zeilenabstand an?

Gilt nur für diese Aktionsschaltfläche, nicht für die gesamte App. Ich bin nicht sehr vertraut mit HTML oder CSS, aber wenn ich mich erinnere, gibt es eine Möglichkeit, die HTML/CSS-Formatierung auf alle Objekte in der Anwendung oder nur auf bestimmte Objekte in der Anwendung anzuwenden: Ich bin daran interessiert, sie nur auf die anzuwenden angegebenes Objekt.

MWE-Code:

library(shiny)

ui <- fluidPage(
  br(),
  actionButton(
    "add",
    HTML("Add <br/> column"), 
    width = '80px',
    style='padding:0px; font-size:100%')
  )

server <- function(input,output,session)({})

shinyApp(ui, server)

P粉336536706
P粉336536706

Antworte allen(1)
P粉237125700

您可以覆盖闪亮的默认 line-height css 规则。

actionButton(
    "add",
    HTML("Add 
column"), width = '80px', style='padding:0px; font-size:100%; line-height:1;') // notice addition of 'line-height:1;' )

/*this is default styling aplied by shiny*/

button {
  color: #333;
  background-color: #fff;
  display: inline-block;
  margin-bottom: 0;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  border: 1px solid #ccc;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  border-radius: 4px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  -webkit-appearance: button;
  text-transform: none;
}
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage