\n \n

\n Features\n

\n

\n Pricing\n

\n

\n Disabled\n

\n \n \n"} 7f0:["$7f1"] 7ee:{"type":"codeBlock","attrs":"$7ef","content":"$7f0"} 7f2:{"type":"paragraph"} 7f3:{"type":"paragraph"} 7f9:{"color":"rgb(31, 35, 40)"} 7f8:{"type":"textStyle","attrs":"$7f9"} 7f7:["$7f8"] 7f6:{"type":"text","marks":"$7f7","text":"This example demonstrates a responsive navigation bar that adjusts to different screen sizes with minimal effort, showcasing Bootstrap's utility for rapid, responsive web development. Bootstrap has a wide range of components and utilities that can be used to create complex UI elements quickly, as shown in the example above. It hosts a big number of classes, each with its own purpose, making it easy to create custom designs."} 7f5:["$7f6"] 7f4:{"type":"paragraph","content":"$7f5"} 7fa:{"type":"paragraph"} 7fc:{"level":3} 7fe:{"type":"text","text":"Pseudo-classes"} 7fd:["$7fe"] 7fb:{"type":"heading","attrs":"$7fc","content":"$7fd"} 801:{"type":"text","text":"Pseudo-classes are special keywords added to selectors that specify a special state of the selected elements. For example, "} 804:{"type":"code"} 803:["$804"] 802:{"type":"text","marks":"$803","text":":hover"} 805:{"type":"text","text":" can be used to change the style of an element when the user hovers over it. They are used to define the CSS properties that will apply when the element is in certain states or conditions."} 800:["$801","$802","$805"] 7ff:{"type":"paragraph","content":"$800"} 806:{"type":"paragraph"} 808:{"level":3} 80a:{"type":"text","text":"Common Pseudo-classes"} 809:["$80a"] 807:{"type":"heading","attrs":"$808","content":"$809"} 80c:{"tight":true,"start":1} 814:{"type":"code"} 813:["$814"] 812:{"type":"text","mark

Challenges

Lecture 1: Challenge 1: Creating a Submit Form

Lecture 2: Challenge 2: Create a Counter Web App

Lecture 3: Challenge 3: Creating a Todo List