css - 使用 bootstrap 和 R 导航栏中的 Logo

标签 css r bootstrap-4 shiny

我正在使用 Bootstrap 构建一个 R Shiny 应用程序来处理样式。我希望将 Logo 放置在导航栏内,右对齐。查看 Bootstrap 文档,它应该是这样的:

<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
   <a class="navbar-brand" href="#">
     <img src="bird.jpg" alt="Logo" style="width:40px;">
   </a>
  ...
</nav>

这是我的 .css 文件的样子以及我认为应该如何实现:

.navbar-brand{
  background-image: url(www/logo.png);
  align: right;

 }

我不熟悉样式或 Bootstrap ,这是 bootstrap.css 文件的一个片段:

bootstrap.css snippet

最佳答案

我喜欢这样,在 www 文件夹中使用 logo.png:

.logo {
  text-decoration: none;
  border: 0;
  width: 50px;
  height: 50px;
  margin: 0;
  top: 3px;
  right: 15px;
  background: url(logo.png) no-repeat 0 0;
  background-size: 46px 46px;
  position: absolute;
  z-index: 100000000;
}

ui.R 中:

tags$head(
    tags$a(class="logo", target="_blank",
           href="http://link.com/")
)

关于css - 使用 bootstrap 和 R 导航栏中的 Logo ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47757794/

相关文章:

css - 自定义 Bootstrap 4 css

css - 使用 listStyleImage 属性更新 Firefox toolbarbutton

javascript - 边缘、悬停和单击

r - 当 block 标签不加引号时有什么缺点吗?

javascript - 为什么我的 JavaScript 没有加载到 Bootstrap 选项卡中?

css - 如何在一行中对齐所有文本框

html - 我的下拉菜单没有水平显示,下拉按钮之间有一个空格。任何人?

javascript - ng-grid 嵌入式菜单被隐藏

r - 帮助加速 R 中的循环

r - 填充数据框中的第 n 列