在reveal.js中，有沒有可能讓第一個片段自動可見？

我將文本顏色高亮功能連接到一個稍微亮一點的顏色到最近可見的片段上，以便將注意力集中在那個片段上。當下一個片段可見時，文本恢復正常顏色。

如果我把文本的第一行變成非片段，它會立刻出現，但是是普通的文本顏色。如果我把它變成一個片段，我必須前進一次，使第一行出現(這是一個合理的后退，只是不是我的偏好)。不過，當它是碎片時，高亮顏色確實有用。

以下是一些示例標記:

<section>
      <h2>Highlight First Line Test</h2>
      <p class="fragment highlight-current">Want this line visible <i>and</i> colour highlighted on slide entry</p>
      <p class="fragment highlight-current">Appears 2nd with colour highlight</p>
    </section>

我使用CSS覆蓋來掛鉤reveal.js突出顯示函數:

.reveal .slides section .fragment.highlight-current.current-fragment {
      color: #f00; 
    }

(我也看過autoslide，但無法讓它做我想做的事情)。

通過使用淡出樣式的修改，您可以將第一行作為一個片段，開始時是可見的，當不再是當前的時，可以使用不同的顏色。

<style>
    .reveal .slides section .fragment.fade-down {
        opacity: 1;
        visibility: visible;
    }
    .reveal .slides section .fragment.fade-down.visible,
    .reveal .slides section .fragment.visible:not(.current-fragment) {
        color: grey;
    }
    .reveal .slides section .fragment.fade-down,
    .reveal .slides section .fragment.current-fragment {
        color: #1b91ff;
    }
</style>

<section>
  <h2 class="fragment fade-down" data-fragment-index="0">Highlight First Line Test</h2>
  <p class="fragment" data-fragment-index="0">Want this line visible <i>and</i> colour highlighted on slide entry</p>
  <p class="fragment">Appears 2nd with colour highlight</p>
</section>

確保為第一個和第二個片段都設置了data-fragment-index="0 ",以便在第一個片段淡出時顯示第二個片段。

老問題了，不過我覺得我想出了一個更好的解決方案，比較通用，只針對CSS。

/* Select only the first fragment and undo the hiding styling RevealJS */
/* applies by default */
.reveal .slides section .fragment:first-child {
  /* (what you do in here depends on the fragment animations you have applied) */
  opacity: 1;
  visibility: visible;
  transform: translate(0, 0);
}

/* Select the first child only if any subsequent child has the */
/* .current-fragment class (i.e. when the 1st fragment is not the */
/* currently selected one) */
.reveal .slides section .fragment:first-child:has(~ .current-fragment) {
  /* (what you do in here depends on the fragment animations you have applied) */
  opacity: 0.5;
}