Gin-golang: 使用样式表加载HTML文件

huangapple go评论94阅读模式
英文:

Gin-golang: Loading html files with stylesheet

问题

我的英语非常基础,很抱歉 Gin-golang: 使用样式表加载HTML文件

我的问题是,当Gin加载HTML时,我的HTML文件包含import (/stylesheet/index.css),所以当我用Gin运行我的应用程序时,它会提示无法加载样式表文件。

main.go

r.LoadHTMLFiles("../templates/index.tmpl.html")

r.GET("/index", func(c *gin.Context) {
    c.HTML(200, "index.tmpl.html", gin.H{
        "title": "Main website", //IGNORE THIS
    })
})

index.tmpl.html

<!DOCTYPE html>
<head>
  <title>Hola titulo</title>
  <style type="text/css" media="screen">
    <!-- 
        @import url("/css/index.css");
    -->
  </style>
</head>

<body>

  <header>
    <h1>City Gallery</h1>
  </header>

  <nav>
    London<br>
    Paris<br>
    Tokyo
  </nav>

  <section>
    <h1>London</h1>
    <p>London is the capital city of England. It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.</p>
    <p>Standing on the River Thames, London has been a major settlement for two millennia,
its history going back to its founding by the Romans, who named it Londinium.</p>
  </section>

  <footer>
    Copyright © W3Schools.com
  </footer>

</body>

</html>

index.css

header {
   background-color:black;
   color:white;
   text-align:center;
   padding:5px; 
}
nav {
   line-height:30px;
   background-color:#eeeeee;
   height:300px;
   width:100px;
   float:left;
   padding:5px; 
}
section {
   width:350px;
   float:left;
   padding:10px; 
}
footer {
   background-color:black;
   color:white;
   clear:both;
   text-align:center;
   padding:5px; 
}

所以,当我运行我的应用程序时,Gin在调试模式下给我返回404错误。

[GIN] 2016/03/26 - 12:10:50 | 200 | 688.938μs | 127.0.0.1 | GET /index
[GIN] 2016/03/26 - 12:10:50 | 404 | 2.865μs | 127.0.0.1 | GET /css/index.css

另一方面,当我只加载HTML文件时,它可以正常显示样式表。:(

我不知道如何在Gin中加载样式表。

请帮忙,谢谢。

PS:我需要使用Gin。

英文:

my english is very basic, I'm sorry Gin-golang: 使用样式表加载HTML文件

Well, my problem is that when Gin is loading HTML, my HTML file contains import (/stylesheet/index.css), so that when run my app with Gin, this alert that not load stylesheet file

workspace/
          main/
               main.go
          templates/
                   index.tmpl.html
                   css/
                       index.css

main.go

r.LoadHTMLFiles(&quot;../templates/index.tmpl.html&quot;)

r.GET(&quot;/index&quot;, func(c *gin.Context) {
    c.HTML(200, &quot;index.tmpl.html&quot;, gin.H{
        &quot;title&quot;: &quot;Main website&quot;, //IGNORE THIS
    })
})

index.tmpl.html

&lt;!DOCTYPE html&gt;
&lt;head&gt;
  &lt;title&gt;Hola titulo&lt;/title&gt;
  &lt;style type=&quot;text/css&quot; media=&quot;screen&quot;&gt;
    &lt;!-- 
  	    @import url(&quot;/css/index.css&quot;);
    --&gt;
  &lt;/style&gt;
&lt;/head&gt;

&lt;body&gt;

  &lt;header&gt;
    &lt;h1&gt;City Gallery&lt;/h1&gt;
  &lt;/header&gt;

  &lt;nav&gt;
    London&lt;br&gt;
    Paris&lt;br&gt;
    Tokyo
  &lt;/nav&gt;

  &lt;section&gt;
    &lt;h1&gt;London&lt;/h1&gt;
    &lt;p&gt;London is the capital city of England. It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.&lt;/p&gt;
    &lt;p&gt;Standing on the River Thames, London has been a major settlement for two millennia,
its history going back to its founding by the Romans, who named it Londinium.&lt;/p&gt;
  &lt;/section&gt;

  &lt;footer&gt;
    Copyright &#169; W3Schools.com
  &lt;/footer&gt;

&lt;/body&gt;

&lt;/html&gt;

index.css

header {
   background-color:black;
   color:white;
   text-align:center;
   padding:5px; 
}
nav {
   line-height:30px;
   background-color:#eeeeee;
   height:300px;
   width:100px;
   float:left;
   padding:5px; 
}
section {
   width:350px;
   float:left;
   padding:10px; 
}
footer {
   background-color:black;
   color:white;
   clear:both;
   text-align:center;
   padding:5px; 
}

So, I am runnning my app and this give me error 404 in Gin mode debug.

[GIN] 2016/03/26 - 12:10:50 | 200 |     688.938&#181;s | 127.0.0.1 |   GET     /index
[GIN] 2016/03/26 - 12:10:50 | 404 |       2.865&#181;s | 127.0.0.1 |   GET     /css/index.css

On the other hand when I load html file only, this shows the stylesheet without problems. Gin-golang: 使用样式表加载HTML文件

I do not know how to load the stylesheet with Gin.

Help, please.

PS: I need use Gin

答案1

得分: 16

你需要在 main.go 中为静态文件添加一个处理程序。使用 Static

r.Static("/css", "../templates/css")
英文:

You need a handler for static files in main.go. Use Static.

r.Static(&quot;/css&quot;, &quot;../templates/css&quot;)

答案2

得分: -3

在你的index.tmpl.html文件中尝试替换以下内容:

&lt;style type=&quot;text/css&quot; media=&quot;screen&quot;&gt;
    &lt;!-- 
        @import url(&quot;/css/index.css&quot;);
    --&gt;
&lt;/style&gt;

替换为:

&lt;style type=&quot;text/css&quot; media=&quot;screen&quot;&gt;
    &lt;!-- 
        @import url(&quot;css/index.css&quot;);
    --&gt;
&lt;/style&gt;
英文:

In your index.tmpl.html file try replacing the following :

&lt;style type=&quot;text/css&quot; media=&quot;screen&quot;&gt;
    &lt;!-- 
        @import url(&quot;/css/index.css&quot;);
    --&gt;
&lt;/style&gt;

to this one :

&lt;style type=&quot;text/css&quot; media=&quot;screen&quot;&gt;
    &lt;!-- 
        @import url(&quot;css/index.css&quot;);
    --&gt;
&lt;/style&gt;

huangapple
  • 本文由 发表于 2016年3月26日 23:24:28
  • 转载请务必保留本文链接:https://go.coder-hub.com/36237060.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定