R Markdown：将图像放在 HTML 的右上角并将标题向下移动

Question

我想在我的 R markdown 报告的右上角放置一个公司徽标图像，然后将标题向下移动，比如比默认位置低 3 或 4 厘米。这个想法是它看起来像公司信笺。

谁能建议我如何在我的 .Rmd 文件中对此进行编码？

感谢您的帮助！

Answer 1

选项 1：

在 RMarkdown 文档的开头（或其他地方）添加此脚本：

<script>
   $(document).ready(function() {
     $head = $('#header');
     $head.prepend('<img src=\"logo.jpg\" style=\"float: right;width: 150px;\"/>')
   });
</script>

这看起来像

要使脚本正常工作，图像必须与 .Rmd 文档位于同一文件夹中。您还可以为 <img> 标签指定 id 并使用

添加更精确的 CSS 样式

<style>
  #myLogo {
    float: right;
    width: 120px;
    ...
</style>

选项 2：

创建一个额外的 HTML 文件（例如 extLogo.html），其中包含如下徽标：

<div><img src="logo.jpg" width="200px" align="right"></div>

然后像这样修改 YAML header：

---
title: "Test"
author: "Martin Schmelzer"
date: "13 Juli 2016"
output: 
  html_document:
    includes:
      in_header: extLogo.html
---

这看起来像

并且可能需要更多 margin/padding 选项...

Answer 2

如果您将 img src 更改为 base 64 代码（大尺寸真的很乱），那么图像将不再依赖于您的本地目录，例如您可以通过电子邮件向某人发送 html 文件以使用交互式报告。

base64编码器： https://www.base64decode.org/

R Markdown：将图像放在 HTML 的右上角并将标题向下移动

R Markdown: Putting an image in the top right hand corner of HTML and moving title down

html

css

r

r-markdown