diff options
Diffstat (limited to 'css/05-classless-css')
| -rw-r--r-- | css/05-classless-css/index.html | 40 |
1 files changed, 40 insertions, 0 deletions
diff --git a/css/05-classless-css/index.html b/css/05-classless-css/index.html new file mode 100644 index 0000000..6f72bcb --- /dev/null +++ b/css/05-classless-css/index.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>Beautiful HTML-Only Page</title> + <!-- The magic line: This automatically styles everything below --> + <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@exampledev/new.css@1.1.2/new.min.css"> +</head> +<body> + + <header> + <h1>🚀 Built with Pure HTML</h1> + <p>Zero custom CSS files were written to create this look.</p> + </header> + + <main> + <article> + <h2>Semantic Layouts Work Best</h2> + <p>Classless frameworks look at your semantic HTML tags. They add consistent padding, clean typography, and standard responsive widths automatically.</p> + <p>This page is styled using <a href="https://newcss.net/" target="_blank">new.css</a>.</p> + </article> + + <section> + <h3>Interactive Elements</h3> + <p>Notice how inputs and buttons are automatically styled:</p> + <form action="#"> + <input type="email" placeholder="Enter your email..."> + <button type="submit">Subscribe</button> + </form> + </section> + </main> + + <footer> + <p>© 2026 No-CSS Experiment</p> + </footer> + +</body> +</html> + |