diff options
| author | Kamal Wickramanayake <kamal@inbox.lk> | 2026-07-04 14:35:25 +0530 |
|---|---|---|
| committer | Kamal Wickramanayake <kamal@inbox.lk> | 2026-07-04 14:35:25 +0530 |
| commit | c3dd2a6d44ef929e0832ce6dca53a818e6711218 (patch) | |
| tree | 66d7254ef8534a0e23b50f9d1fce41cb36a8e6ab /css/05-classless-css | |
| parent | 975dccebfcf51878b790a765d8e92ebcad895a24 (diff) | |
Added CSS examples
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> + |