Slidy演示文稿全局Logo、首页背景配置及日期位置调整求助

一、为所有幻灯片添加全局Logo #

Slidy不支持ioslides那种直接通过YAML的logo参数全局加Logo的方式，用CSS就能实现：

/* 全局Logo：所有非封面幻灯片右上角固定显示 */
.slide:not(.titlepage)::after {
  content: '';
  position: fixed;
  top: 20px;
  right: 20px;
  width: 100px; /* 按需调整Logo宽度 */
  height: 40px; /* 按需调整Logo高度 */
  background-image: url('logo.png');
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 100;
}

这段代码会在除封面外的所有幻灯片右上角固定展示Logo，位置和尺寸可以根据你的需求修改。

二、修复封面日期位置问题 #

你当前的CSS给h1加了底部内边距和背景图，导致日期被挤到Logo下方。通过单独控制日期容器的位置就能解决：

更新后的完整styles.css代码：

/* 封面整体布局 */
div.slide.titlepage {
  text-align: left;
  background-image: url('logo_1.png');
  background-size: auto;
  background-repeat: no-repeat;
  background-position: right; 
  position: relative; /* 为日期绝对定位提供参照 */
}

div.slide.titlepage h1 {
  padding-bottom: 30%;
  margin-right: 0;
  background-image: url('logo.png');
  background-position: left bottom;
  background-repeat: no-repeat;
  background-size: 150px 60px;
}

/* 调整日期回到原有位置 */
div.slide.titlepage .date {
  position: absolute;
  bottom: 20px; /* 和原布局一致的底部距离 */
  left: 20px; /* 保持左对齐 */
  margin: 0;
}

关键说明： #

1. 给封面容器div.slide.titlepage加position: relative，让内部的日期元素可以基于它做绝对定位。
2. 针对日期容器.date设置绝对定位，指定bottom和left的值，就能让它回到封面左下角的原有位置，不会被h1的背景Logo遮挡。

三、YAML配置保持不变 #

你的原有YAML配置无需修改，继续使用即可：

---
title: "10"
output:
   slidy_presentation:
      css: styles.css
date: "2022-11-01"
runtime: shiny
---

内容的提问来源于stack exchange，提问作者Sami Khamash