Shulou(Shulou.com)06/01 Report--

Editor to share with you how to reset the style in css, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

1. Css initializes the margin and padding values of tags in all browsers (inner and outer margins)

Body,h2,h3,h4,h5,h6,h7,hr,p,blockquote,/*structuralelements structural element * /

Dl,dt,dd,ul,ol,li,/*listelements list element * /

Pre,/*textformattingelements text formatting element * /

Form,fieldset,legend,button,input,textarea,/*formelements form element * /

Th,td/*tableelements table elements * / {

Margin:0

Padding:0

}

2. Css resets the page element style

Body {background:#fff} / * reset the background of the body page to white * /

Body,th,td,input,select,textarea,button {/ * reset page text attributes * /

Font-size:12px;line-height:1;font-family: "Microsoft Yahei", "boldface", "Song style"; color:#666

}

/ * * css resets the style of the style label * /

H2 {font-size:18px;/*18px/12px=1.5*/}

H3 {font-size:16px;}

H4 {font-size:14px;}

H5,h6,h7 {font-size:100%;}

Address,caption,cite,code,dfn,em,var {font-style:normal;font-weight:normal} / * righting italics * /

Code,kbd,pre,samp {font-family:couriernew,courier,monospace;} / * uniform equal width font * /

Small {font-size:12px;} / * Chinese less than 12px is difficult to read, let small normalize * /

3. Css resets the list element style

Dl,ul,ol,menu,li {list-style:none} / * reset the class table leading symbol to onne,menu is valid in HTML5 * /

4. Css resets the text formatting element style (mouse effect)

/ * * reset link a label * /

A {color:#666;text-decoration:none} / * reset link a label style * /

_

/ * cancel the dotted frame after the a tag is clicked * /

A {outline:none;}

A:active {star:_expression (this.onFocus=this.blur ());}

/ * * set the background color and text color of page text when dragging the mouse to select * /

/ *

:: selection {color:#fff;background-color:#4C6E78;}

::-moz-selection {color:#fff;background-color:#4C6E78;}

, /

5. Css resets the style of form elements

Legend {color:#000;} / * forie6*/

Fieldset,img {border:0none} / * reset fieldset (form grouping), the border of the picture is 0 frames /

Button,input,select,textarea {

Font-size:100%;/* enables form elements to inherit font sizes under ie, * /

Vertical-align:middle;/* resets form controls to center vertically * /

}

/ * Note: optgroup cannot correct * /

/ * reset the form button button effect * /

Button {border:0none;background-color:transparent;cursor:pointer}

Img {vertical-align:top} / * Vertical position of the picture in the current line * /

6. Css resets table element styles

Caption {display:none;} / * reset the table title to Hidden * /

Table {width:100%;border-collapse:collapse;border-spacing:0;table-layout:fixed;} / * reset table properties * /

7. Clear the float

/ * clear float * /

.clear {clear:both;}

/ * clear floats-recommended * /

.clearfix: before,.clearfix:after {content:'';display:table;}

.clearfix: after {clear:both;}

8. Css resets nested references

Blockquote,q {quotes:none} / * reset the quotation mark type of nested references * /

Blockquote:before,blockquote:after,q:before,q:after {content:'';content:none} / * reset nested references * /

The above is all the content of the article "how to reset styles in css". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.