body
요소에 대한 CSS가 두 번 표시됩니다 (모든 규칙이 처음으로 삭제되었습니다). 첫 번째 body
요소는 URL에서 제공 : http://localhost:3000/assets/application.css?body=1
레일스에서 scss 파일과 중복 된 CSS
제 2 body
요소는 URL에서 제공 : http://localhost:3000/assets/scaffolds.css?body=1
내가 /app/assets/stylesheets
디렉토리라고 header.css.scss 다른하는 SCS 파일을 추가했습니다. 이제는 원하는대로 모든 웹 페이지에 /assets/header.css
으로 포함됩니다. 그러나 application.css는 모든 페이지의 모든 내용을 다시 복제합니다.
내가 잘못 했습니까? 자산에 header.css.scss 파일을 만들지 않았습니까? 왜 내 모든 CSS 규칙이 중복됩니까?
UPDATE :
@import "compass/css3/images";
header {
border-bottom: 1px solid #6787d2;
height: 7em;
position: relative;
background-color: #f0edee;
background-image: url("/assets/background_header.png");
padding: 10px 10px 0 10px;
box-shadow: 0 -1px 3px #C0BABB inset;
}
header address {
background-color: #b9dd8c;
@include filter-gradient(#b9dd8c, #5ab86d, vertical);
$experimental-support-for-svg: true;
@include background-image(linear-gradient(top, #b9dd8c 0%,#5ab86d 100%));
border: 1px solid #15905b;
}
:
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the top of the
* compiled file, but it's generally better to create a new file per style scope.
*
*= require_self
*= require_tree .
*/
body {
margin: 0;
}
#content {
padding: 10px;
background-color: #eee;
}
code {
background-color: #d0d0d0;
padding: 1px 3px;
}
내 header.scss 파일이 application.css과 아무런 공통점이 없다 : 내 application.css의 파일은 거기에 몇 가지 간단한 CSS를 가지고
application.html.erb
레이아웃에는 CSS 참조가 하나만 있습니다.
<!DOCTYPE html>
<html>
<head>
<title>whatever</title>
<%= stylesheet_link_tag "application", :media => "all" %>
마지막으로보기에는 CSS에 대한 참조가 전혀 없습니다.
application.css.scss 파일의 맨 위에있는 항목은 무엇입니까? 또한, html의 application.css 이상을 포함하고 있습니까? application.css에 대한 CSS 링크 만 있어야합니다. –
자산 파이프 라인을 개발할 때 모든 파일을 별도로 가져오고,'application.css'는 나머지 파일의 코드를 포함하지 않아야합니다. 'application.css' 전체를 파일 시스템에 게시해야합니다 (브라우저에 제공되는 것이 아닙니다). – rewritten