inlineCSS: Add inline CSS
In daattali/shinyjs: Easily Improve the User Experience of Your Shiny Apps in Seconds
inlineCSS R Documentation
Add inline CSS
Description
Add inline CSS to a Shiny app. This is simply a convenience function that
gets called from a Shiny app's UI to make it less tedious to add inline CSS.
If there are many CSS rules, it is recommended to use an external stylesheet.
CSS is a simple way to describe how elements on a web page should be
displayed (position, colour, size, etc.). You can learn the basics
at W3Schools.
Usage
inlineCSS(rules, minify = TRUE)
Arguments
rules
The CSS rules to add. Can either be a string with valid
CSS code, or a named list of the form
list(selector = declarations), where selector is a valid
CSS selector and declarations is a string or vector of declarations.
See examples for clarification.
minify
If TRUE, the CSS rules will be condensed as much as possible
to save on bandwidth. If FALSE, whitespace is added to make the CSS more
human-readable, which is easier for debugging.
Value
Inline CSS code that is automatically inserted to the app's
<head> tag.
Examples
if (interactive()) {
library(shiny)
# Method 1 - passing a string of valid CSS
shinyApp(
ui = fluidPage(
inlineCSS("#big { font-size:30px; }
.red { color: red; border: 1px solid black;}"),
p(id = "big", "This will be big"),
p(class = "red", "This will be red and bordered")
),
server = function(input, output) {}
)
# Method 2 - passing a list of CSS selectors/declarations
# where each declaration is a full declaration block
shinyApp(
ui = fluidPage(
inlineCSS(list(
"#big" = "font-size:30px",
".red" = "color: red; border: 1px solid black;"
)),
p(id = "big", "This will be big"),
p(class = "red", "This will be red and bordered")
),
server = function(input, output) {}
)
# Method 3 - passing a list of CSS selectors/declarations
# where each declaration is a vector of declarations
shinyApp(
ui = fluidPage(
inlineCSS(list(
"#big" = "font-size:30px",
".red" = c("color: red", "border: 1px solid black")
)),
p(id = "big", "This will be big"),
p(class = "red", "This will be red and bordered")
),
server = function(input, output) {}
)
# Use `minify = FALSE` to result in more human-readable CSS
shinyApp(
ui = fluidPage(
inlineCSS(list(
"#big" = "font-size:30px",
".red" = c("color: red", "border: 1px solid black")
), minify = FALSE),
p(id = "big", "This will be big"),
p(class = "red", "This will be red and bordered")
),
server = function(input, output) {}
)
}
daattali/shinyjs documentation built on Nov. 16, 2023, 3:08 p.m.
R Package Documentation
Browse R Packages
We want your feedback!
Note that we can't provide technical support on individual packages. You should contact the package authors for that.
| inlineCSS | R Documentation |
Add inline CSS
Description
Add inline CSS to a Shiny app. This is simply a convenience function that
gets called from a Shiny app's UI to make it less tedious to add inline CSS.
If there are many CSS rules, it is recommended to use an external stylesheet.
CSS is a simple way to describe how elements on a web page should be
displayed (position, colour, size, etc.). You can learn the basics
at W3Schools.
Usage
inlineCSS(rules, minify = TRUE)
Arguments
rules |
The CSS rules to add. Can either be a string with valid
CSS code, or a named list of the form
|
minify |
If |
Value
Inline CSS code that is automatically inserted to the app's
<head> tag.
Examples
if (interactive()) {
library(shiny)
# Method 1 - passing a string of valid CSS
shinyApp(
ui = fluidPage(
inlineCSS("#big { font-size:30px; }
.red { color: red; border: 1px solid black;}"),
p(id = "big", "This will be big"),
p(class = "red", "This will be red and bordered")
),
server = function(input, output) {}
)
# Method 2 - passing a list of CSS selectors/declarations
# where each declaration is a full declaration block
shinyApp(
ui = fluidPage(
inlineCSS(list(
"#big" = "font-size:30px",
".red" = "color: red; border: 1px solid black;"
)),
p(id = "big", "This will be big"),
p(class = "red", "This will be red and bordered")
),
server = function(input, output) {}
)
# Method 3 - passing a list of CSS selectors/declarations
# where each declaration is a vector of declarations
shinyApp(
ui = fluidPage(
inlineCSS(list(
"#big" = "font-size:30px",
".red" = c("color: red", "border: 1px solid black")
)),
p(id = "big", "This will be big"),
p(class = "red", "This will be red and bordered")
),
server = function(input, output) {}
)
# Use `minify = FALSE` to result in more human-readable CSS
shinyApp(
ui = fluidPage(
inlineCSS(list(
"#big" = "font-size:30px",
".red" = c("color: red", "border: 1px solid black")
), minify = FALSE),
p(id = "big", "This will be big"),
p(class = "red", "This will be red and bordered")
),
server = function(input, output) {}
)
}
R Package Documentation
Browse R Packages
We want your feedback!
Note that we can't provide technical support on individual packages. You should contact the package authors for that.
Embedding an R snippet on your website
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.