MoonPoint Support Logo

 

Shop Amazon Warehouse Deals - Deep Discounts on Open-box and Used ProductsAmazon Warehouse Deals



Advanced Search
April
Sun Mon Tue Wed Thu Fri Sat
       
10
 
2021
Months
Apr


Sat, Apr 10, 2021 5:26 pm

Creating a list that is expandable and collapsible in HTML5

If you wish to make a list that can be collapsed and expanded on a webpage or a section on the page that can be expanded to reveal more details, you can use the details and summary tags with version 5 of HTML. E.g., the following code allows information to be displayed or hidden by clicking on an arrowhead that will appear to the left of whatever appears within the summary tags. The information within the details tag will be hidden or displayed by clicking on the arrowhead to toggle between the two options.
<details>
<summary>Overview</summary>
The American Civil War began on April 12, 1865 when South Carolina
militia forces attacked Fort Sumter at Charleston, South Carolina. 
The war effectively ended on April 9, 1865 with the surrender by
Confederate General Robert E. Lee to Union General Ulysses S. Grant, but
the president of the Confederacy, Jefferson Davis, did not declare an
end to the insurrection until May 9, 1865. Each side in the
conflict suffered over 800,000 casualties. The principal cause of the
conflict was the issue of slavery within the United States with abolitionists
in the North viewing the practice as a crime against humanity while Southern
slave owners viewed it as a necessary evil or, for some defenders of slavery,
even as a positive good, which they feared would be eliminated under the
recently elected President Abraham Lincoln.
</details>

[More Info]

[/network/web/html] permanent link

Valid HTML 4.01 Transitional

Privacy Policy   Contact

Blosxom logo