[유튜브 클론코딩] 5. STYLING - 1
2021. 3. 9. 17:35ㆍProjects/유튜브 클론코딩
728x90
반응형
reset.scss
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;
}
a {
all: unset;
cursor: pointer;
}
*,
input {
box-sizing: border-box;
}
input {
border: none;
box-sizing: border-box;
&:focus,
&:active {
outline: none;
}
}
↑ reset.scss
(reset: 브라우저의 기본 값들을 초기화해서 값들을 0으로 만들어주는 것을 말한다.
margin도 날려버리고 기타 등등, 그런 걸 reset이 하는 것이다.
나는 reset css라고 검색해서 복붙, 그리고 니콜라스의 코드 보고 없는 부분 복사해서 만들었음)
728x90
반응형
'Projects > 유튜브 클론코딩' 카테고리의 다른 글
[유튜브 클론코딩] 5. STYLING - 3 (0) | 2021.03.09 |
---|---|
[유튜브 클론코딩] 5. STYLING - 2 (0) | 2021.03.09 |
[유튜브 클론코딩] 4. WEBPACK - ES6 with Webpack (0) | 2021.03.09 |
[유튜브 클론코딩] 4. WEBPACK - 설치 및 설정 (0) | 2021.03.09 |
[유튜브 클론코딩] 3.12 Searching Videos (0) | 2021.03.09 |