리셋 CSS가 효과가 없다 ... (미해결) → 해결할 수 있었다! !
소개
어제부터 원래 앱을 만들었지만,
조속히 집어 버렸습니다.
리셋 CSS가 작동하지 않고 리셋 CSS를 활성화하기 위해 하루를 사용했습니다. (미해결) → 해결했습니다!
user agent stylesheet
라고 나오고 있어, background-color나, width, height등 모두가 효과가 없습니다.
추가
해결되었습니다! ! !
원인은 끔찍했다.
아래에 기재된 application.html.erb
는 평상시,
layouts 디렉토리에 들어 있지만,
나는 뭔가 박자에 layouts/layouts/application
되었습니다.
왜 언제나 이렇게 어리석은 일을 하는 거야! ! ! ! !layouts/application
로 수정하여 종료. 치...
코드
<!DOCTYPE html>
<html>
<head>
<title>アプリケーション名</title>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<link rel="stylesheet" type="text/css" href="stylesheets/reset.css">
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
<body>
<%= yield %>
</body>
</html>
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
body {
line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}
nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
/* change colours to suit your needs */
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}
/* change colours to suit your needs */
mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
}
/* change border colour to suit your needs */
hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
}
HTML5 Doctor CSS Reset
사용하고 싶습니다.
가설①
절차가 잘못 되었습니까?
마이그레이션이나 MVC의 파일을 우선 작성하고 있습니다.
여기를 먼저 실행하면 리셋 CSS가 효과가 없다?
다시 밖에?
반대로 뷰를 만들지 않으면 CSS를 만드는 곳까지 진행할 수 없기 때문에 부정해라고 판단.
가설②<link rel="stylesheet" type="text/css" href="stylesheets/reset.css">
하지만 실수?
href를 URL로 변환했지만,
변하지 않았다.
다른 방법이 있습니까?
가설③<link rel="stylesheet" type="text/css" href="stylesheets/reset.css">
의 기술은 원래 필요하지 않습니까?
reset.css의 파일로 기술하고 있기 (위해)때문에, 불필요.
그러나 직접적인 해결에 연결되지 않았다.
끝에
초보 초보에서 하루를 보내고,
이런 것인지 낙담해 버렸습니다.
가능한 곳까지 일단 실천 해보십시오.
안 된다면 2일째에 돌입합니다. . .
너무 억울하다.
힘내라! !
참고로 하고 있는 사이트
리셋 CSS의 사용법【다운로드로부터 로드까지】
【2021년판】리셋 CSS의 가이드라인|기초로부터 사용법을 철저 해설
리셋 CSS를 사용해 보자.
Reference
이 문제에 관하여(리셋 CSS가 효과가 없다 ... (미해결) → 해결할 수 있었다! !), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/mkato1013/items/c5000dd8cb5409622bc6
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
해결되었습니다! ! !
원인은 끔찍했다.
아래에 기재된
application.html.erb
는 평상시,layouts 디렉토리에 들어 있지만,
나는 뭔가 박자에
layouts/layouts/application
되었습니다.왜 언제나 이렇게 어리석은 일을 하는 거야! ! ! ! !
layouts/application
로 수정하여 종료. 치...코드
<!DOCTYPE html>
<html>
<head>
<title>アプリケーション名</title>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<link rel="stylesheet" type="text/css" href="stylesheets/reset.css">
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
<body>
<%= yield %>
</body>
</html>
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
body {
line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}
nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
/* change colours to suit your needs */
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}
/* change colours to suit your needs */
mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
}
/* change border colour to suit your needs */
hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
}
HTML5 Doctor CSS Reset
사용하고 싶습니다.
가설①
절차가 잘못 되었습니까?
마이그레이션이나 MVC의 파일을 우선 작성하고 있습니다.
여기를 먼저 실행하면 리셋 CSS가 효과가 없다?
다시 밖에?
반대로 뷰를 만들지 않으면 CSS를 만드는 곳까지 진행할 수 없기 때문에 부정해라고 판단.
가설②<link rel="stylesheet" type="text/css" href="stylesheets/reset.css">
하지만 실수?
href를 URL로 변환했지만,
변하지 않았다.
다른 방법이 있습니까?
가설③<link rel="stylesheet" type="text/css" href="stylesheets/reset.css">
의 기술은 원래 필요하지 않습니까?
reset.css의 파일로 기술하고 있기 (위해)때문에, 불필요.
그러나 직접적인 해결에 연결되지 않았다.
끝에
초보 초보에서 하루를 보내고,
이런 것인지 낙담해 버렸습니다.
가능한 곳까지 일단 실천 해보십시오.
안 된다면 2일째에 돌입합니다. . .
너무 억울하다.
힘내라! !
참고로 하고 있는 사이트
리셋 CSS의 사용법【다운로드로부터 로드까지】
【2021년판】리셋 CSS의 가이드라인|기초로부터 사용법을 철저 해설
리셋 CSS를 사용해 보자.
Reference
이 문제에 관하여(리셋 CSS가 효과가 없다 ... (미해결) → 해결할 수 있었다! !), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/mkato1013/items/c5000dd8cb5409622bc6
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
<!DOCTYPE html>
<html>
<head>
<title>アプリケーション名</title>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<link rel="stylesheet" type="text/css" href="stylesheets/reset.css">
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
<body>
<%= yield %>
</body>
</html>
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
body {
line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}
nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
/* change colours to suit your needs */
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}
/* change colours to suit your needs */
mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
}
/* change border colour to suit your needs */
hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
}
초보 초보에서 하루를 보내고,
이런 것인지 낙담해 버렸습니다.
가능한 곳까지 일단 실천 해보십시오.
안 된다면 2일째에 돌입합니다. . .
너무 억울하다.
힘내라! !
참고로 하고 있는 사이트
리셋 CSS의 사용법【다운로드로부터 로드까지】
【2021년판】리셋 CSS의 가이드라인|기초로부터 사용법을 철저 해설
리셋 CSS를 사용해 보자.
Reference
이 문제에 관하여(리셋 CSS가 효과가 없다 ... (미해결) → 해결할 수 있었다! !), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/mkato1013/items/c5000dd8cb5409622bc6텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)