org-mode 中日期标签的颜色发布到 HTML 和文本周围的框答案

【问题标题】：Color of date tag in org-mode publish to HTML and boxes around textorg-mode 中日期标签的颜色发布到 HTML 和文本周围的框
【发布时间】：2011-09-23 15:54:41
【问题描述】：

我正在使用 org-mode 7.4 版来组织我所有的研究笔记，然后导出为 HTML，这样我就可以创建一种个人 wiki。我只有两个问题：

1) 导出到 HTML 后，org-mode 日期标记显示为非常淡的灰色，是否可以将此颜色更改为更粗的颜色？如果修复涉及添加大量凌乱的 CSS 标记，是否可以将某些内容添加到我的 .emacs 文件中？我希望保持我的原始组织文件尽可能整洁和清晰。

2) 另外，在 org-mode 中在某些文本周围添加框的最佳方法是什么？我发现 #+BEGIN_SRC emacs-lisp / #+END_SRC emacs-lisp 标签中的文本与 #+BEGIN_EXAMPLE/#+END_EXAMPLE 相同，因为 org-mode 功能（例如使用星号标记标题和 - ,+,. 标记子项）不会在块中进行评估。我对能够在文本周围放置一个块感兴趣，但仍然需要评估 org-mode 功能，例如标题、子项等。

谢谢你的帮助，我承认我在这里有点菜鸟。

更新：感谢Jonathan Leech-Pepin 和Juancho 的提示。第 1 部分肯定已得到解答，对于手册中遗漏的部分，我深表歉意。

对于第 2 部分，我意识到我可以将 DIV 标签包装在 BEGIN_SRC HTML 标签中，但我希望可能有一种更简单的方法来做到这一点，因为这似乎是许多人想要做的一种突出显示的方式或偏移文本。我希望有一些等同于我只是缺少的 BEGIN_EXAMPLE/END_EXAMPLE 标签的东西。我可以使用 DIV 标签，如果需要的话也会使用，但如果你经常这样做，它最终会使原始 org 文件看起来有点混乱和难以辨认。因此，如果有人知道捷径，我会很高兴听到它。我想如果我知道我在做什么更多，我可以编写自己的函数，一旦我完成我的论文提案并且实际上有更多的空闲时间，我可能最终会研究它。 :)

谢谢大家！！！

【问题讨论】：

标签： html publish org-mode

【解决方案1】：

对于第 1 点）

您可以调整单个文件的 CSS 设置或创建自定义样式表。

样式格式化的相关类在Org Manual - CSS Support中列出

作为我添加的测试（作为单行，换行是为了让页面更容易阅读）

#+STYLE: <style type="text/css"> .timestamp { color: purple; font-weight: bold; }
         </style>

到我的一个组织文件并导出。时间戳是加粗的紫色，更清晰。

【讨论】：

谢谢！这正是我一直在寻找的。导出配置选项中的某些内容，而不是文本本身的正文。我的项目有一个自定义样式表，但不确定如何专门调出时间戳，我想要一些即使 org 文件不是项目的一部分也能正常工作的东西。对于手册中遗漏了这一点，我深表歉意，但是当您刚开始时，组织手册可能会让您有些不知所措。

【解决方案2】：

org-mode 中的 HTML 导出器大量添加了 class 标识符，以便您可以随意设置 HTML 样式。

看看http://orgmode.org/manual/CSS-support.html

您不需要将 CSS 包含在文档本身中。您可以通过 #+STYLE 指令链接到样式表，也可以自定义 org-mode 附带的默认 CSS。

至于问题 2，看一下导出的 org-mode 文件。有很多 div 部分可以通过 CSS 设置样式，例如添加边框。

【讨论】：

谢谢，我在我的博客上做了很多 div 边框，我认为在 org-mode 中将它们包装在 #+BEGIN_SRC HTML 标签中会很麻烦而且有点痛苦。并不是说它不起作用，但我只是希望可能有一种更简洁的方法来保持 org 文件本身更清晰。这似乎是一件显而易见的事情，我希望有某种类型的内置功能，我在手册中以某种方式错过了。这本手册很棒，但如果您一开始不习惯计算机编码或 CSS 脚本，也很容易错过一些内容。

【解决方案3】：

如果您喜欢反复试验以及查看示例与规范，另一种选择是下载一些示例并注意调整了哪些 css 元素。

比如我最近在尝试改变html中导出标签的背景颜色，发现this org-mode mailing list thread。我抓起一份 worg-original.css 并在其中搜索“tag”这个词：

.tag {
    color: #DDD;
    font-size: 70%;
    font-weight: 500;
}

我不喜欢背景，并注意到具有background-color 属性的其他元素，所以我使用它并最终得到：

.tag {
   color: #000;
   background-color: #ccf;
   font-size: 85%;
   font-weight: 500;
   margin: 0 0 0 8em;
}

您可以对时间戳属性执行相同的操作。我建议找到一些你喜欢的东西并将它们放在一个 .css 文件中。从那里您可以将#+style: 行放入每个文件中（如前所述）：

#+STYLE: <link rel="stylesheet" type="text/css" href="path/to/stylesheet.css" />

与其他答案相比，这并不是什么新鲜事；我主要将其添加为另一种方法。我不知道 css，所以查看 org 手册中的属性列表（p.author、.timestamp-kwd、.todo）对我来说意义不大。找到一个专门为 org-mode 专家设计的 .css，例如上面邮件列表中链接的 org 手册和 worg 更有用，因为我可以看到一些切实的示例并从在那里。

【讨论】：