How to clear the default style and set the common style in CSS

Time:2020-3-22

CSS clear default style

General clear default style:


*{
    margin:0;
    padding:0
}
li{
    list-style:none
}
img{
    vertical-align:top;
    border:none
}

Set default font

body,
button, input, select, textarea /* for ie */ {
    font: 14px/1.5 tahoma, b8bf53, sans-serif;
}
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal;}
Address, cite, DFN, EM, VAR {font style: normal;} / * righting italics*/
Code, KBD, pre, samp {font family: Courier New, courier, monospace;} / * uniform equal width font*/
Small {font size: 12px;} / * Chinese less than 12px is hard to read, normalize small*/
/**Reset list elements**/
ul, ol { list-style: none; }
/**Reset text formatting elements**/
a { text-decoration: none; }
a:hover { text-decoration: underline; }
Sup {vertical align: text top;} / * reset to reduce the impact on row height*/
sub { vertical-align: text-bottom; }
/**Reset form elements**/
legend { color: #000; } /* for ie6 */
Fieldset, img {border: 0;} / * img ride: make the IMG in the link borderless*/
Button, input, select, textarea {font size: 100%;} / * enables form elements to inherit font size under IE*/
/*Note: optgroup cannot be righted*/
/*Reset HTML5 elements*/
article, aside, details, figcaption, figure, footer,header, hgroup, menu, nav, section,
summary, time, mark, audio, video {
    display: block;
    margin: 0;
    padding: 0;
}
mark { background: #ff0; }
/*Set the default style for placeholder*/
:-moz-placeholder {
    color: #ddd;
    opacity: 1;
}
::-moz-placeholder {
    color: #ddd;
    opacity: 1;
}
input:-ms-input-placeholder {
    color: #ddd;
    opacity: 1;
}
input::-webkit-input-placeholder {
    color: #ddd;
    opacity: 1;
}

Select Tags

select {
    border: none;
    appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;
    /*Show a small arrow image in the far right center of the selection box*/
    background: url("https://imgs.developpaper.com/imgs/arrow.png") no-repeat scroll right center transparent;
    padding-right: 14px;
}

Reset table elements


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

Reset HR


hr {
    border: none;
    height: 1px;
}

Clear the default style for < ol > < UL >


ul, ol, { 
  margin: 0;
  padding: 0;
  list-style: n;
}

. button button

.button{
    border:0;
    background-color:none
    outline:none;
    -WebKit appearance: none; // used to remove native styles under IOS
}

< a > tags


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

< input > tag

input{
    border: none;
    appearance:none;
    -moz-appearance:none;
    Outline: none; // the default border does not appear when the input tag is focused:
    -WebKit appearance: none; // used to remove native styles under IOS
}
//or:
Input: focus {Outline: none;} // the default border does not appear for input tag focus:
border: none; appearance:none; -moz-appearance:none; Outline: none; // the default border does not appear when the input tag is focused: -webkit-appearance: no

summary

The above is the way that Xiaobian introduced to you to clear the default style and set the public style of CSS. I hope it will help you. If you have any questions, please leave a message to me, and Xiaobian will reply to you in time. Thank you very much for your support of the developepaer website!
If you think this article is helpful to you, welcome to reprint, please indicate the source, thank you!

Recommended Today

On the reference count in PHP string type

Author: Wang Shu Background introduction String type is also a commonly used type. Due to the characteristics of strings, in order to save memory, the same string variables usually share a block of memory space. By reference counting, multiple variables are marked to use this memory. However, after GDB tracking, it is found that not […]