

CodePen Challenge - List Styles
source link: https://codepen.io/mirandalwashburn/pen/MWrQEPq
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

CodePen Challenge
xxxxxxxxxx
<main>
<h1>To do</h1>
<h2>April 5</h2>
<ul class="list">
<li class="list__item list__item-complete">Buy groceries
<ul class="list-nested">
<li class="list-nested__item">3 tomatoes</li>
<li class="list-nested__item">1 bunch of cherries</li>
<li class="list-nested__item">6 onions</li>
<li class="list-nested__item">3 heads of garlic</li>
<li class="list-nested__item">1 bag spring mix</li>
</ul>
</li>
<li class="list__item">Cancel gym membership</li>
<li class="list__item">Clean gutters</li>
<li class="list__item">Sort recycling & put out trash</li>
</ul>
<div class="add">
Recommend
-
80
currentTarget vs target CodePen HomeOpen this Pen in:
-
57
One more step Please complete the security check to access codepen.io What can I do to prevent thi...
-
8
Card style experiment (Codepen Challenge) 0 unsaved changes xxxxxxxxxx<div class="main"> <ul class="cards">
-
11
Codepen Challengexxxxxxxxxx<div class="poster"> <div class="lens-flare"></div> <div class="stripes">...
-
11
Book Text Codepen Challenge 0 unsaved changes xxxxxxxxxx<main> <header> <h1>Mrs. Dalloway</h...
-
5
Codepen Challenge 0 unsaved changes xxxxxxxxxx<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg">
-
12
JS (Babel) xxxxxxxxxxconst frame = new Frame("fit", 1024, 768, dark, darker);frame.on("ready", ()=>{ // ES6 Arrow Function - similar to function(...
-
9
Pen Settings HTML Preprocessor Add Class(es) to <html> Stuff for <head>
-
10
#CodePenChallenge: List Styles 0 unsaved changes xxxxxxxxxx<main> <header> <h1>Todo Li...
-
10
JS (Babel) xxxxxxxxxximport zim from "https://zimjs.org/cdn/00/zim";// see https://zimjs.com...
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK