HTML 5 Reset Stylesheet

HTML 5 Reset Stylesheet
This CSS reset is modified based on Eric Meyers' CSS reset, and specifically adjusts the initialization style of the corresponding tags for HTML5.

/*
html5doctor.com Reset Stylesheet
v1.4
2009-07-27
Author: Richard Clark - http://richclarkdesign.com
*/

html, 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, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
body {
line-height:1;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section {
display:block;
}

nav ul {
list-style:none;
}

blockquote, q {
quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
content:”;
content:none;
}

a {
margin:0;
padding:0;
border:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}

ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}

mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}

del {
text-decoration: line-through;
}

abbr[title], dfn[title] {
border-bottom:1px dotted #000;
cursor:help;
}

table {
border-collapse:collapse;
border-spacing:0;
}

hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}

input, select {
vertical-align:middle;
}

What to update?
Removed those tag styles that are not recommended in HTML5, such as <acronym><font><big>... Added new tag styles for HTML5, removed the default padding, margin and border, and made sure that the display attribute of elements that should be displayed as block-level elements is specified as block.

Using attribute selectors

Attribute selectors are added to the <abbr> and <dfn> elements to specify a style for these two elements when they have the title attribute. This is considered from the perspective of accessibility.

discuss

Adding outline:0 to an anchor point has serious accessibility issues and will disable keyboard navigation.

ins, mark does not need to add background color when the font color is not set.

For more information, click here: http://html5doctor.com/html-5-reset-stylesheet/

<<:  Solution to Docker's failure to release ports

>>:  Detailed explanation of CSS animation attribute keyframes

Recommend

Teach you about react routing in five minutes

Table of contents What is Routing Basic use of pu...

Robots.txt detailed introduction

Robots.txt is a plain text file in which website ...

JavaScript Document Object Model DOM

Table of contents 1. JavaScript can change all HT...

MySQL 8.0.25 decompression version installation and configuration method graphic tutorial

MySQL 8.0.25 decompression version installation t...

Summary of Git commit log modification methods

Case 1: Last submission and no push Execute the f...

Summary of Textarea line break issues in HTML

Recently, I encountered a problem of whether the d...

CSS3 frosted glass effect

If the frosted glass effect is done well, it can ...

Native JS to achieve cool paging effect

This article uses an example to share with you a ...

The complete implementation process of Sudoku using JavaScript

Table of contents Preface How to solve Sudoku Fil...

Summary of Linux ps and pstree command knowledge points

The ps command in Linux is the abbreviation of Pr...

Detailed explanation of the usage of common Linux commands (Part 2) ———— Text editor commands vi/vim

Introduction to vi/vim They are both multi-mode e...

Implementation of k8s deployment of docker container

Environment: (docker, k8s cluster), continue with...

Img semi-transparent processing Img plus semi-transparent background implementation ideas and code

Copy code The code is as follows: <!DOCTYPE ht...

Vue mobile terminal realizes finger sliding effect

This article example shares the specific code for...

How to deploy zabbix_agent in docker

zabbix_agent deployment: Recommendation: zabbix_a...