我有这个文件:
app/views/listings/list.html.erb
在我的rails项目中.以下是该文件的内容:
<h1>This file is:"list.html.erb"</h1>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
</style>
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?key=key&sensor=false">
</script>
<%=javascript_include_tag 'application'%>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:80%; height:80%"</div>
<input type="button" onclick="getlistings();" value="Add Markers">
<input type="button" onclick="clearMarkers();" value="Remove Markers">
</body>
</html>
我喜欢将样式表应用于它.我应该在哪里放置样式表？我尝试将代码放在此文件中:
app/assets/stylesheets/listings.css.scss
但该样式未应用于html文件.我还需要更改我的html视图文件中的任何内容以包含样式表吗？
这是位于以下位置的样式表:"app/assets/stylesheets/listings.css.scss"
// Place all the styles related to the Listings controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
.listings
{
table tr td
{
padding: 5px;
vertical-align: top;
}
dt
{
color: #232;
font-weight: bold;
font-size: larger;
}
dd
{
margin: 0;
}
}
#map_canvas
{
width: 80%;
height: 80%;
}
所以想知道是否有人可以帮助我？
谢谢
编辑
所以application.html.erb文件很好,application.css也是如此.我在阅读下面发布的答案后修改了list.html.erb文件.新的list.html.erb文件如下:
<h1>Filename = list.html.erb</h1>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
</style>
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?key=AIz&sensor=false">
</script>
<%= stylesheet_link_tag 'application' %>
<%=javascript_include_tag 'application'%>
<%= stylesheet_link_tag'列表'%>
现在只有问题,我想采取
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
</style>
这部分来自list.html.erb并将其放入list.css.scss文件中.但是当我这样做时,map_canvas从页面中消失,它没有显示.
And*_*rew 11
你放样式表的地方很好.您需要确保应用程序布局(app/views/layouts/application.html.erb)包含标题中的样式表:
stylesheet_link_tag 'application'
然后,您需要确保它包含在您的应用程序清单中: app/assets/stylesheets/application.css
在顶部你应该看到一个如下所示的块:
/* ...
*= require_self
*= require_tree .
*/
如果它没有说,*= require_tree .则它不会直接自动加载样式表中的scss文件.欲了解更多看到导轨导向.
如果您的应用程序布局和清单正确并且您仍然遇到问题,请将这些文件的文本添加到问题中,我将查看.
更新:此外,您似乎没有正确理解布局.
当任何视图呈现时,您希望最终输出如下所示:
<!DOCTYPE HTML>
<html>
<head>
...header stuff goes here...
</head>
<body>
... body stuff goes here...
</body>
</html>
您的标题等是非常标准的内容,一直重复,只有页面主要部分的内容与页面不同.因此,为了避免不得不一遍又一遍地复制这些东西,Rails使用布局.
你的布局文件app/views/layouts/application.html.erb应该是这样的(至少)
<!DOCTYPE html>
<html>
<head>
<title>The name of your site</title>
<%= stylesheet_link_tag 'application' %>
<%= javascript_include_tag 'application' %>
<%= csrf_meta_tags %>
<head>
<body>
<%= yield %>
</body>
</html>
当您加载给定视图时,rails将从该视图中填充yield命令在布局中的内容.
请注意,您的视图名称错误.如果您要显示一个列表app/views/listings/show.html.erb,或者如果您要显示它应该是的所有列表的索引app/views/listings/index.html.erb.
然后在该文件中你应该:
<h1>This file is:"index.html.erb"</h1>
有关布局和渲染的更多信息,请参阅rails指南.
但是,看起来你正试图潜入铁轨而不知道系统中发生了什么.欢迎来到Rails,我想你会发现它真的很棒,但是你会从一个好的教程开始,给自己一个巨大的帮助.您可以尝试使用入门指南.我还推荐Michael Hartl的书"Rails 3 Tutorial".这是一个很好的资源.