Skapa ett kollapsande lista med ren CSS -kod utan behov av Java eller JavaScript i din källfilen . Genom att använda provet koden nedan , kan du få en lista som stängs eller öppnas varje gång du klickar på motsvarande länk . När du klickar på " Dölj " listan kollapsar från insyn och när " Expandera " klickar på länken , och sedan listan visas på skärmen . Instruktioner
1
Öppna en textredigerare på datorn och skapa ett nytt , tomt dokument
2
Skriv följande kod i toppen av dokumentet : .
3
Infoga följande kod under "
" taggen :
< stil type = " text /css " > raden { vertikal - align : top ; höjd : auto viktigt ;} . . lista . { display: none ; } show { display : none ;} . . hide : mål + show { display : . inline ; } hide : mål { display : . none; } hide : målet ~ lista { display : inline ; } @ media print { dölja, visa { display : . . . none; } } < /style > < ;/head >
4
Infoga följande kod under " < /head > " taggen , som innehåller en förteckning innehåll och uppmanar CSS tidigare inställda :
