zoukankan      html  css  js  c++  java
  • Thymeleaf(一)---引入js/css文件

    th:href="@{/static/css/style.css}"
    th:src="@{/static/js/thymeleaf.js}"

    index.html

     <head>
            <meta charset="UTF-8">
            <title>首页</title>
            <link rel="stylesheet" type="text/css" media="all" href="/static/css/style.css" th:href="@{/static/css/style.css}"/>
            <script type="text/javascript" src="/static/js/thymeleaf.js" th:src="@{/static/js/thymeleaf.js}"></script>
            <script>
                testFunction();
            </script>
    
        </head>
        <body>
            <h1 th:text="#{title}"></h1>
            <h1 th:text="${message}"></h1>
    
            <div class="showing">
                <p th:text="${name}" >name</p>
                <p th:text="'Hello! ' + ${name} + '!'" >hello world</p>
                <p th:text="'Hello!'+ ${name}+'!'" >hello world</p>
            </div>
    
        </body>

    application.yml

    spring:
       mvc:
          static-path-pattern: /static/**
       resources:
          static-locations: classpath:/static/
    
       #开始thymeleaf设置
       thymeleaf:
       #禁用模板缓存
          cache: false
     #设置文字消息
       messages:
          encoding: UTF-8
          basename: message_zh_CN

    controller:

       @GetMapping("/h")
        public String t(Model model){
            String title="标题";
            String message="first thymeleaf !!";
            String name="牡蛎";
            model.addAttribute("message",message);
            model.addAttribute("title",title);
            model.addAttribute("name",name);
            return "index";
        }

    js/css

    function testFunction(){
        alert("test Thymeleaf.js!");
    }
    
    
    div.showing{
        80%;
        margin:20px auto;
        border:1px solid grey;
        padding:30px;
    }
    
    .even{
        background-color: red;
    }
    .odd{
        background-color: green;
    }

     

  • 相关阅读:
    打造好团队
    为什么要先订一个小目标
    什么叫上层次?
    信息系统的数据大分类
    系统有问题基本出在数据库上,web层无状态
    20155201 预备作业02
    预备作业01:你期望的师生关系是什么?
    laravel 获取当前路由 和url
    laravel -admin 禁止某一行删除
    laravel-admin 密码加密
  • 原文地址:https://www.cnblogs.com/crazy-lc/p/12255924.html
Copyright © 2011-2022 走看看