nannanwu/GoCode
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

基本样式测试

Browse Source
This commit is contained in:
喃喃污
2025-11-23 21:48:11 +08:00
parent 86b28ed215
commit a469da2904
8 changed files with 126 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
main.go
View File

@@ -4,73 +4,43 @@ import (
"github.com/gin-gonic/gin" "github.com/gin-gonic/gin"
) )
type Article struct {
Title string
Desc string
Content string
}
func main() { func main() {
r := gin.Default() r := gin.Default()
//html模板文件
r.LoadHTMLGlob("templates/*") // 静态资源映射
r.Static("/static", "./static")
// 加载模板（支持多层目录）
r.LoadHTMLGlob("templates/**/*")
// 路由
r.GET("/", func(c *gin.Context) { r.GET("/", func(c *gin.Context) {
c.String(200, "首页") c.HTML(200, "pages/index.html", gin.H{
}) "Title": "首页",
r.GET("/json", func(c *gin.Context) {
c.JSON(200, map[string]interface{}{
"success": "true",
"msg": "你好gin",
}) })
}) })
r.GET("/json2", func(c *gin.Context) { r.GET("/about", func(c *gin.Context) {
c.JSON(200, gin.H{ c.HTML(200, "pages/about.html", gin.H{
"success": "true", "Title": "关于我们",
"msg": "你好gin",
}) })
}) })
r.GET("/json3", func(c *gin.Context) { r.GET("/articles", func(c *gin.Context) {
a := Article{ c.HTML(200, "pages/articles.html", gin.H{
Title: "我是一个标题", "Title": "文章列表",
Desc: "描述", "Articles": []map[string]string{
Content: "测试内容", {"Title": "Gin框架入门", "Date": "2025-11-23"},
} {"Title": "Go语言最佳实践", "Date": "2025-11-20"},
c.JSON(200, a) },
})
//响应jsonp请求 http://0.0.0.0:8080/jsonp?callback=xxx
r.GET("/jsonp", func(c *gin.Context) {
a := Article{
Title: "我是一个标题",
Desc: "描述",
Content: "测试内容",
}
c.JSONP(200, a)
})
r.GET("xml", func(c *gin.Context) {
c.XML(200, gin.H{
"success": "true",
"msg": "你好gin，我是一个xml",
}) })
}) })
r.GET("news", func(c *gin.Context) { r.GET("/contact", func(c *gin.Context) {
c.HTML(200, "news.html", gin.H{ c.HTML(200, "pages/contact.html", gin.H{
"title": "我是一个后台数据", "Title": "联系我们",
}) })
}) })
r.GET("goods", func(c *gin.Context) { r.Run(":8080")
c.HTML(200, "news.html", gin.H{
"title": "我是一个商品页面",
})
})
err := r.Run()
if err != nil {
return
} // listen and serve on 0.0.0.0:8080
} }

65
static/style.css Normal file
View File

@@ -0,0 +1,65 @@
body {
margin: 0;
font-family: "Segoe UI", Arial, sans-serif;
background: #f4f6f9;
color: #333;
}
.navbar {
display: flex;
justify-content: space-between;
align-items: center;
background: linear-gradient(90deg, #1e3c72, #2a5298);
padding: 0.8rem 2rem;
box-shadow: 0 4px 10px rgba(0,0,0,0.3);
}
.navbar .logo {
font-size: 1.5rem;
font-weight: bold;
color: #fff;
letter-spacing: 2px;
transition: transform 0.3s ease;
}
.navbar .logo:hover {
transform: scale(1.1) rotate(-3deg);
}
.nav-links {
list-style: none;
display: flex;
gap: 1.5rem;
}
.nav-links li a {
text-decoration: none;
color: #fff;
font-weight: 500;
position: relative;
transition: color 0.3s ease;
}
.nav-links li a::after {
content: "";
position: absolute;
width: 0%;
height: 2px;
bottom: -4px;
left: 0;
background-color: #ffcc00;
transition: width 0.3s ease;
}
.nav-links li a:hover {
color: #ffcc00;
}
.nav-links li a:hover::after {
width: 100%;
}
main {
padding: 2rem;
}
main h1, main h2 {
color: #2a5298;
}
main p {
line-height: 1.6;
}

12
templates/goods.html
View File

@@ -1,12 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
</head>
<body>
<h2>{{.title}}</h2>
</body>
</html>

12
templates/index.html
View File

@@ -1,12 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
</head>
<body>
<h2>我是一个新闻界面</h2>
</body>
</html>

17
templates/layout/base.html Normal file
View File

@@ -0,0 +1,17 @@
{{ define "layout/base.html" }}
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>{{ block "title" . }}默认标题{{ end }}</title>
<link rel="stylesheet" href="/static/style.css">
</head>
<body>
{{ template "layout/navbar.html" . }}
<main>
{{ block "content" . }}{{ end }}
</main>
</body>
</html>
{{ end }}

11
templates/layout/navbar.html Normal file
View File

@@ -0,0 +1,11 @@
{{ define "layout/navbar.html" }}
<nav class="navbar">
<div class="logo">🔥 NanNanWu</div>
<ul class="nav-links">
<li><a href="/">首页</a></li>
<li><a href="/about">关于我们</a></li>
<li><a href="/articles">文章</a></li>
<li><a href="/contact">联系</a></li>
</ul>
</nav>
{{ end }}

12
templates/news.html
View File

@@ -1,12 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
</head>
<body>
<h2>{{.title}}</h2>
</body>
</html>

9
templates/pages/index.html Normal file
View File

@@ -0,0 +1,9 @@
{{ define "pages/index.html" }}
{{ template "layout/base.html" . }}
{{ block "title" . }}首页{{ end }}
{{ block "content" . }}
<h1>欢迎来到我的 Gin 网站</h1>
<p>这里是首页内容，可以展示最新文章或公告。</p>
{{ end }}
{{ end }}