TOC لا يعمل عند وضعه داخل وسوم HTML

الدعم
1

سؤال آخر. لقد أضفت عنصر div إضافيًا للمقال. الآن يبدو كما يلي:

<div data-theme-toc="true"></div>
<div data-theme-profile="manual">
## الفصل الأول
## الفصل الثاني
</div>

لكن جدول المحتويات غير مرئي في هذه الحالة. كيف يمكن إصلاح ذلك؟

2

لا أعرف غرضك، ولكن يمكنك استهداف العناوين باستخدام عدة طرق.

  1. استخدم علامات عنوان HTML مع سمات البيانات (data-attributes)، مثل <h1>Chapter 1</h1> حتى تتمكن من استهداف [data-header-1] باستخدام CSS.

  2. قم بإدراج div فارغ بسمة بيانات في نقطة ما، والتي يمكنك استخدامها لاستهداف العناصر التالية. على سبيل المثال، وضع <div data-next-titles></div> بعد العنوان الثاني وإضافة CSS هذا:

    [data-next-titles] ~ .d-toc-post-heading {
    color: pink;
}

    سيؤدي هذا إلى:

    image
    image730×725 32.4 KB

لذلك، يعتمد الأمر حقًا على هدفك.
قد يكون هذا الدليل مفيدًا: Customize posts' contents with your own styles