HTML tag default style arrangement

HTML tag default style arrangement
html, address,blockquote,body, dd, div,dl, dt, fieldset, form,frame, frameset,h1, h2, h3, h4,h5, h6, noframes,ol, p, ul, center,dir, hr, menu, pre { display: block }/*The above list elements are displayed in block by default. Those not displayed will be displayed as inline elements. This list is for HTML4 version. Some elements will be deprecated in XHTML1*/
li { display: list-item }/*Displayed as a list by default*/
head { display: none }/*Not displayed by default*/
table { display: table }/*Default is table display*/
tr { display: table-row }/*Default is table row display*/
thead { display: table-header-group }/*Default is table header group display*/
tbody { display: table-row-group }/*Default is table row group display*/
tfoot { display: table-footer-group }/*Default is table footer group display*/
col { display: table-column }/*Default is table column display*/
colgroup { display: table-column-group }/*Default is table column grouping*/

td, th { display: table-cell; }/*Default is cell display*/

caption { display: table-caption }/*Defaults to table title display*/

th { font-weight: bolder; text-align: center }/*Default is table title display, bold and centered*/
caption { text-align: center }/*Default is table title display, centered*/
body { margin: 8px; line-height: 1.12 }
h1 { font-size: 2em; margin: .67em 0 }
h2 { font-size: 1.5em; margin: .75em 0 }
h3 { font-size: 1.17em; margin: .83em 0 }
h4, p, blockquote, ul, fieldset, form, ol, dl, dir, menu { margin: 1.12em 0 }
h5 { font-size: .83em; margin: 1.5em 0 }
h6 { font-size: .75em; margin: 1.67em 0 }
h1, h2, h3, h4, h5, h6, b,strong { font-weight: bolder }
blockquote { margin-left: 40px; margin-right: 40px }
i, cite, em,var, address { font-style: italic }
pre, tt, code, kbd, samp { font-family: monospace }
pre { white-space: pre }
button, textarea, input, object, select { display:inline-block; }
big { font-size: 1.17em }
small, sub, sup { font-size: .83em }
sub { vertical-align: sub }/*Defines the sub element to be displayed as a subscript by default*/
sup { vertical-align: super }/*Defines the sub element to be displayed as superscript by default*/
table { border-spacing: 2px; }
thead, tbody, tfoot { vertical-align: middle }/*Defines the header, body, and footer elements to be vertically aligned by default*/
td, th { vertical-align: inherit }/*Defines the vertical alignment of cells and column headers by default and inherits by default*/
s, strike, del { text-decoration: line-through }/*Define these elements to be displayed as deleted lines by default*/

hr { border: 1px inset }/*Define the dividing line to have a 1px wide 3D concave effect by default*/

ol, ul, dir, menu, dd { margin-left: 40px }

ol { list-style-type: decimal }
ol ul, ul ol, ul ul, ol ol { margin-top: 0; margin-bottom: 0 }
u, ins { text-decoration: underline }
br:before { content: ""A" }/*Define the pseudo-object content style of the line break element*/
:before, :after { white-space: pre-line }/*Define the default style of the pseudo-object space character*/
center { text-align: center }
abbr, acronym { font-variant: small-caps; letter-spacing: 0.1em }
:link, :visited { text-decoration: underline }
:focus { outline: thin dotted invert }
/* Begin bidirectionality settings (do not change) */
BDO[DIR="ltr"] { direction: ltr; unicode-bidi: bidi-override }/*Defines the default text reading and writing display order when the BDO element attribute is DIR="ltr"*/
BDO[DIR="rtl"] { direction: rtl; unicode-bidi: bidi-override }/*Defines the default text reading and writing display order when the BDO element attribute is DIR="rtl"*/
*[DIR="ltr"] { direction: ltr; unicode-bidi: embed }/*Defines the default text reading and writing display order for any element when its attribute is DIR="ltr"*/
*[DIR="rtl"] { direction: rtl; unicode-bidi: embed }/*Defines the default text reading and writing display order for any element when its attribute is DIR="rtl"*/

@media print { /*Define the default print style for titles and lists*/
h1 { page-break-before: always }
h1, h2, h3, h4, h5, h6 { page-break-after: avoid }
ul, ol, dl { page-break-before: avoid }
}

Browser default style

1. Page Margins
The default value for IE is 10px, which can be set by the margin property of body.
The default value of FF is 8px. To clear the page margins through the body's padding attribute setting, you must clear these two attribute values.

Copy code
The code is as follows:

body {
margin:0;
padding:0;
}

2. Paragraph spacing
The default value for IE is 19px, which can be set by using the margin-top property of p.
The default value in FF is 1.12em, which can be set by the margin-bottom property of p.
p is displayed in blocks by default. To clear the segment spacing, you can usually set

Copy code
The code is as follows:

p {
margin-top:0;
margin-bottom:0;
}

3. Title Style
h1~h6 are displayed in bold by default: font-weight:bold;.
For the default size, please refer to the table above.

Copy code
The code is as follows:

h1 {font-size:xx-large;}
h2 {font-size:x-large;}
h3 {font-size:large;}
h4 {font-size:medium;}
h5 {font-size:small;}
h6 {font-size:x-small;}

The default font size of most browsers is 16px, which is equal to medium. The h1~h6 elements are displayed in bold fonts in block fonts by default.
To clear the title style, you can usually set

Copy code
The code is as follows:

hx {
font-weight:normal;
font-size:value;
}

4. List Style
The default value of IE is 40px, which can be set by the margin attribute of ul and ol.
The default value in FF is 40px, which can be set by the padding property of ul and ol.
dl has no indentation, but the description element dd inside it is indented 40px by default, while the name element dt has no indentation.
To clear the list style, you can usually set

Copy code
The code is as follows:

ul, ol, dd {
list-style-type:none;/*Clear list style character*/
margin-left:0;/*Clear IE left indent*/
padding-left:0;/*Clear non-IE left indent*/
}

5. Centering Elements
IE defaults to text-align:center;
The default value of FF is margin-left:auto;margin-right:auto;

6. Hyperlink Style
The default style is underlined and displayed in blue. Visited hyperlinks turn purple. To clear the link style, you can usually set

Copy code
The code is as follows:

a {
text-decoration:none;
color:#colorname;
}

7 Mouse Styles
IE defaults to cursor:hand;
FF defaults to cursor:pointer;. This statement also works in IE

8 Image link styles
IE defaults to a 2px purple border line
FF defaults to a 2px blue border. To clear the image link style, you can usually set
img {
border:0;
}

<<:  BUG of odd width and height in IE6

>>:  Two ways to achieve horizontal arrangement of ul and li using CSS

Recommend

ElementUI implements the el-form form reset function button

Table of contents Business scenario: Effect demon...

MySQL database master-slave replication and read-write separation

Table of contents 1. Master-slave replication Mas...

CSS multi-level menu implementation code

This is a pretty cool feature that makes web page...

Example code for implementing image adaptive container with CSS

There is often a scenario where the image needs t...

Vue implements form data validation example code

Add rules to the el-form form: Define rules in da...

How to check PCIe version and speed in Linux

PCIE has four different specifications. Let’s tak...

How to set up ssh password-free login to Linux server

Every time you log in to the test server, you alw...

Solution to Navicat Premier remote connection to MySQL error 10038

Remote connection to MySQL fails, there may be th...

js to achieve simple calendar effect

This article shares the specific code of js to ac...

Vue+axios sample code for uploading pictures and recognizing faces

Table of contents Axios Request Qs processing dat...

Pure js to achieve the effect of carousel

This article shares the specific code of js to ac...

Detailed explanation of process management in Linux system

Table of contents 1. The concept of process and t...

Docker solution for logging in without root privileges

When you use the docker command for the first tim...

Docker exec executes multiple commands

The docker exec command can execute commands in a...