├── .gitignore ├── assets └── css │ └── styles.css ├── bower.json ├── index.html ├── package.json ├── readme.md └── robots.txt /.gitignore: -------------------------------------------------------------------------------- 1 | 2 | .DS_Store 3 | -------------------------------------------------------------------------------- /assets/css/styles.css: -------------------------------------------------------------------------------- 1 | html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {margin: 0; padding: 0; border: 0; font-size: 100%; font-weight: normal; vertical-align: baseline; background: transparent;} 2 | 3 | main, article, aside, figure, footer, header, nav, section, details, summary {display: block;} 4 | 5 | html {box-sizing: border-box;} 6 | 7 | *, *:before, *:after {box-sizing: inherit;} 8 | 9 | img {max-width: 100%;} 10 | 11 | ul {list-style: none;} /* we'll restore bullets as needed for content */ 12 | 13 | blockquote, q {quotes: none;} 14 | 15 | blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;} 16 | 17 | a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;} 18 | 19 | del {text-decoration: line-through;} 20 | 21 | abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;} 22 | 23 | table {border-collapse: separate; border-spacing: 0; text-align: left;} 24 | th {font-weight: bold; vertical-align: bottom;} 25 | td {font-weight: normal; vertical-align: top;} 26 | td img {vertical-align: top;} 27 | 28 | hr {display: block; height: 1px; border: 0; border-top: 1px solid #999; margin: 1rem 0; padding: 0;} 29 | 30 | input, select {vertical-align: middle;} 31 | 32 | pre {white-space: pre-line;} 33 | 34 | input[type="radio"] {vertical-align: text-bottom;} 35 | input[type="checkbox"] {vertical-align: bottom;} 36 | 37 | small {font-size: .8rem;} 38 | 39 | strong {font-weight: bold;} 40 | 41 | sub, sup {font-size: .8rem; line-height: 0; position: relative;} 42 | sup {top: -0.5rem;} 43 | sub {bottom: -0.25rem;} 44 | 45 | pre, code, kbd, samp {font-family: monospace, sans-serif;} 46 | 47 | label, input[type=button], input[type=submit], input[type=file], button {cursor: pointer;} 48 | 49 | button, input, select, textarea {margin: 0;} 50 | 51 | ins {background-color: var(--highlight-color); color: #000; text-decoration: none;} 52 | mark {background-color: var(--highlight-color); color: #000; font-style: italic; font-weight: bold;} 53 | 54 | blockquote {padding: 2rem; border-left: 1px solid #333;} 55 | 56 | .clearfix:after {content: ""; display: table; clear: both;} /* https://css-tricks.com/snippets/css/clear-fix/ */ 57 | 58 | h1, h2, h3, h4, h5, h6 {text-wrap: balance} 59 | 60 | p {text-wrap: pretty;} 61 | 62 | @media (prefers-reduced-motion: no-preference) { 63 | :has(:target) { 64 | scroll-behavior: smooth; 65 | } 66 | } 67 | 68 | /* ———— END THE GENERIC RESETS ———— */ 69 | 70 | :root { 71 | --font-system: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; /* https://css-tricks.com/snippets/css/system-font-stack */ 72 | --text-color: #333; 73 | --featured-color: #03f; 74 | --featured-color-hover: #69f; 75 | --highlight-color: #fcd700; 76 | } 77 | 78 | body {font-size: 16px; font-family: var(--font-system); color: var(--text-color);} 79 | 80 | a {color: var(--featured-color);} 81 | a:hover {color: var(--featured-color-hover);} 82 | 83 | @media screen and (max-width: 480px) { 84 | 85 | } 86 | 87 | @media print { 88 | 89 | } 90 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "Name": "HTML5-Reset", 3 | "Version": "3.0", 4 | "Homepage": "https://github.com/murtaugh/HTML5-Reset", 5 | "authors": [ 6 | "Tim Murtaugh " 7 | ], 8 | "description": "A simple set of best practices to get HTML5 projects off on the right foot.", 9 | "main": "index.html", 10 | "keywords": [ 11 | "html5", 12 | "reset", 13 | "css", 14 | "templates" 15 | ], 16 | "license": "MIT", 17 | "ignore": [ 18 | "**/.*", 19 | "node_modules", 20 | "bower_components", 21 | "test", 22 | "tests" 23 | ] 24 | } 25 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 |
35 | 36 |
37 | 38 |

Page Title

39 | 40 | 49 | 50 |
51 | 52 |
53 | 54 |
55 | 56 |

Article Header

57 | 58 |

Etiam pretium odio eu mi convallis vitae varius neque pharetra. Nulla vestibulum nisi ut sem cursus sed mattis nisi egestas.

59 | 60 |

Article Subhead

61 | 62 |

Vestibulum lacus erat, volutpat vel dignissim at, fringilla ut felis.

63 | 64 |
65 |
66 | 67 | Personal Info 68 | 69 | 70 | Single word names are supported. 71 | 72 | 73 | 74 | 75 | 76 |
77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 |
86 | 87 |
88 | 89 | 96 | 97 |
98 | 99 |
100 | 101 |

© 2023 Your Name Here. All Rights Reserved.

102 | 103 |
104 | 105 |
106 | 107 | 108 | 109 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "HTML5-Reset", 3 | "version": "3.0", 4 | "homepage": "https://github.com/wbinnssmith/HTML5-Reset", 5 | "bugs": { 6 | "url": "https://github.com/wbinnssmith/HTML5-Reset/issues" 7 | }, 8 | "author": "Tim Murtaugh ", 9 | "description": "A simple set of best practices to get HTML5 projects off on the right foot.", 10 | "style": "assets/css/styles.css", 11 | "repository": { 12 | "type": "git", 13 | "url": "git+https://github.com/wbinnssmith/HTML5-Reset.git" 14 | }, 15 | "keywords": [ 16 | "html5", 17 | "reset", 18 | "css", 19 | "templates" 20 | ], 21 | "license": "MIT" 22 | } 23 | -------------------------------------------------------------------------------- /readme.md: -------------------------------------------------------------------------------- 1 | # HTML5 Reset 2 | 3 | HTML5 Reset is a simple set of best practices to get web projects off on the right foot. 4 | 5 | ## STREAMLINED FOR 2023 6 | 7 | 1. We make almost no opinionated decisions — the style sheet is designed to strip initial styles from browsers, providing a blank slate 8 | 2. No more Analytics, Modernizr, or jQuery 9 | 3. Basic CSS variables 10 | 4. Links to useful 3rd party tools 11 | 5. Removed extraneous comments 12 | 13 | ## A note on font-sizing 14 | 15 | We prefer `rem` for the simplicity; you will need to swap in `em` in `styles.css` if that's your style. 16 | 17 | ## Command-line installation: 18 | 19 | ``` 20 | bower install HTML5-Reset 21 | ``` 22 | -------------------------------------------------------------------------------- /robots.txt: -------------------------------------------------------------------------------- 1 | # www.robotstxt.org/ 2 | # www.google.com/support/webmasters/bin/answer.py?hl=en&answer=156449 3 | 4 | User-agent: * --------------------------------------------------------------------------------