Here's an Example of HTML Code for a table of contents with 10 items, Using a Gray Background Color with Verdana font.
What is Table of Content
A table of contents, often abbreviated as TOC, is a list of the main sections or chapters of a book, document, or website, along with the page or section numbers where they can be found. It provides readers with an overview of the content and structure of the document, and allows them to easily navigate to specific sections of interest.
In printed Books, the table of contents is typically located near the beginning of the book, after the title page and any dedications or prefaces. In electronic documents or websites, the table of contents may be displayed in a sidebar or as a menu at the top of the page, and may include clickable links to quickly jump to the desired section.
The table of contents is especially useful for longer documents that are organized into multiple sections, as it allows readers to quickly locate and reference specific information without having to read through the entire document. It can also be helpful for authors and editors to create an outline of the document's structure and ensure that it is logically organized and easy to follow.
Below Table of Content Html Code you Can Copy from here and Use it.
<div style="background-color: #ededed; padding: 10px;">
<h3 style="font-family: Verdana;">Table of Contents</h3>
<ol style="font-family: Verdana; list-style-type: decimal;">
<li><a href="#section1">Introduction</a></li>
<li><a href="#section2">HTML Basics</a></li><li><a href="#section3">HTML Elements</a></li>
<li><a href="#section4">HTML Attributes</a></li>
<li><a href="#section5">HTML Headings</a></li>
<li><a href="#section6">HTML Paragraphs</a></li>
<li><a href="#section7">HTML Images</a></li>
<li><a href="#section8">HTML Lists</a></li>
<li><a href="#section9">HTML Tables</a></li>
<li><a href="#section10">Conclusion</a></li>
</ol></div>
<section id="section1">
<h2>Introduction</h2>
<!--Content goes here-->
</section>
<section id="section2">
<h2>HTML Basics</h2>
<!--Content goes here-->
</section>
<section id="section3">
<h2>HTML Elements</h2>
<!--Content goes here-->
</section>
<section id="section4">
<h2>HTML Attributes</h2>
<!--Content goes here-->
</section>
<section id="section5">
<h2>HTML Headings</h2>
<!--Content goes here-->
</section>
<section id="section6">
<h2>HTML Paragraphs</h2>
<!--Content goes here-->
</section>
<section id="section7">
<h2>HTML Images</h2>
<!--Content goes here-->
</section>
<section id="section8">
<h2>HTML Lists</h2>
<!--Content goes here-->
</section>
<section id="section9">
<h2>HTML Tables</h2>
<!--Content goes here-->
</section>
<section id="section10">
<h2>Conclusion</h2>
<!--Content goes here-->
</section>
Below Example of this Table of Content Html Code.
Table of Contents
- Introduction
- HTML Basics
- HTML Elements
- HTML Attributes
- HTML Headings
- HTML Paragraphs
- HTML Images
- HTML Lists
- HTML Tables
- Conclusion