브라우저당 디폴트로 적용되어 있는 CSS가 있다고 합니다!
자신이 홈페이지를 만들었는데 브라우저당 디폴트 값때문에 UI가 망가질 가능성이 있겠죠?
그걸 방지하기 위해 CSS를 작업할 때 맨 처음 이 디폴트 값들을 초기해주어야 됩니다.
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse; border-spacing: 0;
}이 코드를 CSS 맨 처음에 그대로 복붙해놓으면 간단히 디폴트 값을 초기화할 수 있답니다!
자신이 만든 CSS 값까지 초기화되는 거 아니냐구요?
걱정하지마세요!
CSS는 절차지향 언어이기 때문에
순서에 따라 적용되므로
맨 처음 디폴트 값 초기화한 다음 자신의 코드를 적용하면 문제 없이 적용됩니다 !