UNPKG

pagecss

Version:

Beautiful CSS for single page sites - simple all the way up!

58 lines (44 loc) 1.88 kB
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Full Width Example - PageCSS</title> <link href="favicon.ico" rel="icon"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="https://pagecss.org/"> <meta name="twitter:creator" content="@andychilton"> <meta name="twitter:title" content="PageCSS"> <meta name="twitter:description" content="Beautiful CSS for single page sites - a myriad of options and components."> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="../dist/page.css"> </head> <body class="pagecss"> <main> <section> <h1>A Section and a Heading</h1> <p> Let's see how it looks without any <code>.container</code> class added anywhere. Firstly, this is just a section with a heading and a paragraph. Let's try looking at some <code>&lt;nav&gt;</code>. </p> </section> <section> <nav class="inverse"> <ul> <li><a href="/">PageCSS</a></li> <li><a href="#about">About</a></li> <li><a href="#contact">Contact</a></li> <li class="u-right"><a href="#login">Login</a></li> <li class="u-right"><span>Welcome</span></li> </ul> </nav> <p>That was a nav with some menu items in it.</p> </section> </main> <footer> <p>This is a rather plain footer - just a <code>&lt;p&gt;</code> in a <code>&lt;footer&gt;</code>.</p> </footer> </body> </html>