1 . onclick事件
   <a th:onclick="'javascript:more()'" ></a> 
2.引入CSS样式

<link th:href="@{fore/css/public.css}" rel="stylesheet"> 
3.引入js 文件

<script th:src="@{fore/js/index.js}" type="text/javascript"></script>

4. 引入头部信息,和尾部信息
注:html(文件夹)/public.html 页面上的 头部和尾部信息引入

  1. <!-- 导航 头部信息-->
  2. <!-- 导航 头部信息引入 -->
  3. <div class="nav-container" th:fragment="topper">
  4. <div th:replace="html/public :: topper">
  5. </div>
  6. <!-- 底部信息 -->
  7. <!-- 底部信息引入 -->
  8. <div class="att-bottom" th:fragment="footer">
  9. <div th:replace="html/public :: footer"></div>

5. 图片引入
 <img th:src="@{fore/images/nav_icona.png}"/>

6.页面遍历
 <li th:each="item,i:${list}"></li> 
7.if 判断 以及 th:text 取值

  1. <span th:if="${item.types==1}" style="color:green;">
  2. <span th:text=" ${item.coinNum}" ></span>
  3. <i class='fa fa-database'></i>
  4. </span>

8.时间类型格式化

<span th:text="${#dates.format(item.updateTime,'yyyy/MM/dd HH:mm')}"></span>

9.自定义标签属性
 <div th:attr="_tId=${item.taskId}"> 
10.获取css样式  <i class='fa fa-database'></i>  
获取 <i class='fa fa-database'></i> 图标样式 时,
<i>标签不能写在th:text <span>的取值中,
另写一个'<span>'标签 与取值的<span标签不属于同一标签内即可> (如下)

  1. <span th:if="${item.types==1}" style="color:green;">
  2. <span th:text=" ${item.coinNum}" >
  3. </span> <i class='fa fa-database'></i>
  4. </span>
  1. 这样即可获取 <i class='fa fa-database'></i>  图标样式
    11.themeleaf if标签判断显示哪一个

根据 th:if="${item.authstate != 1}" 值判断显示哪一个

12.themeleaf字符串拼接

th:id="|autohomeId${i.index}|" 字符拼接两个大竖线

类似的 class属性等,有多个需要竖线全部包含  th:class="|per-addId per-addtype${i.index}|"  所使用的属性前要加 th 标识

Thymeleaf 使用时的标签的更多相关文章

  1. <context:component-scan>子标签:<context:include-filter>和<context:exclude-filter>使用时要注意的地方

    在Spring MVC中的配置中一般会遇到这两个标签,作为<context:component-scan>的子标签出现. 但在使用时要注意一下几点: 1.在很多配置中一般都会吧Spring ...

  2. 【SpringMVC】<context:include-filter>和<context:exclude-filter>使用时要注意的地方

    http://jinnianshilongnian.iteye.com/blog/1762632 http://blog.51cto.com/wenshengzhu/1700340 http://ww ...

  3. Cookie使用时需要注意个数及大小限制

    各浏览器对Cookie有一定的限制,在使用时需要格外注意. 各浏览器之间对cookie的不同限制:   IE6.0 IE7.0/8.0/9.0+ Opera FF Safari Chrome cook ...

  4. EntityFrameWork 使用时碰到的小问题

    EntityFrameWork 使用时碰到的小问题 1,在使用orm访问数据库的相目里,也要引用EntityFrameWork.dll,否则无法使用orm 否则,编译错误 错误 5 "Sys ...

  5. MySQL 安装和启动服务,“本地计算机 上的 MySQL 服务启动后停止。某些服务在未由其他服务或程序使用时将自动停止。”

    MySQL 安装和启动服务,以及遇到的问题 MySQL版本: mysql-5.7.13-winx64.zip (免安装,解压放到程序文件夹即可,比如 C:\Program Files\mysql-5. ...

  6. MaterialCalendarView使用时遇到的问题

    一.概述 MaterialCalendarView是一个开源项目.功能强大支持多选.单选.标注等. 二.问题 1.其继承自ViewGroup,故与CalendarView半毛钱关系都没有,完全是一个新 ...

  7. [备忘][转]rsync使用时的常见问题

    sync使用时的常见问题: 错误1: rsync: read error: Connection reset by peer (104) rsync error: error in rsync pro ...

  8. 小白学数据分析----->移动游戏的使用时长分析

    写下该文章,是因为之前看到了几款游戏一个典型的玩家刺激活动,在<多塔联盟>,<萌江湖>等多款游戏的设计中都有体现,如下图所示: 这个功能点的设计,今天在这里讲的更多的还是跟数据 ...

  9. VS2010 使用时选择代码或双击时出错,点击窗口按钮后VS自动重启问题

    VS2010 使用时选择代码或双击时出错崩溃,点击窗口按钮后VS自动重启问题 下载补丁,打上补丁之后,重启电脑,解决了问题. WindowsXP的下载地址:Windows XP 更新程序 (KB971 ...

随机推荐

  1. 【luogu P3950 部落冲突】 题解

    题目连接:https://www.luogu.org/problemnew/show/P3950 1.像我这种学数据结构学傻了的 2.边权化点权 所有点权初始化0 3.对于战争 将深度较深的-1,对于 ...

  2. Java运行时异常与一般异常以及错误的异同

    Java提供了两类主要的异常:runtime exception和checked exception.checked 异常也就是我们经常遇到的IO异常,以及SQL异常都是这种异常.对于这种异常,JAV ...

  3. LINQ 方法

    过滤操作符 Where 运算符(Linq扩展方法)根据给定条件过滤集合. 在其中扩展方法有以下两个重载.一个过载需要Func <TSource,bool>输入参数和第二个重载方法需要Fun ...

  4. redis介绍及在购物车项目中的应用,用户认证

    1.redis 2.购物车的构建 api结构: models.py(创建完后自行添加数据) from django.db import models from django.contrib.conte ...

  5. 课时92.CSS元素显示模式转换(掌握)

    我们之前学习的显示模式都可以不用记忆,因为这节课我们要学习转换,我们可以任意来进行一个转换的,上面这些东西有一个了解就行了.所有的标签都有一个属性叫做display,display的中文含义就是显示的 ...

  6. 不再手写import - VSCode自动引入Vue组件和Js模块

    :first-child{margin-top:0!important}.markdown-body>:last-child{margin-bottom:0!important}.markdow ...

  7. Flask中异常捕获

    HTTP 异常主动抛出 abort 方法 抛出一个给定状态代码的 HTTPException 或者 指定响应,例如想要用一个页面未找到异常来终止请求,你可以调用 abort(404). 参数: cod ...

  8. linux运维、架构之路-shell编程(二)

    一.流程控制语句 1.if语句 ①if单分支:一个条件一个结果 1 2 3 4 if 条件   then      命令 fi ②if双分支:一个条件两个结果 1 2 3 4 5 6 if 条件    ...

  9. MB/s与Mbit/s的区别

    数据传输率的单位一般采用MB/s或Mbit/s,尤其在内部数据传输率上官方数据中更多的采用Mbit/s为单位.此处有必要讲解一下两个单位二者之间的差异: MB/s的含义是兆字节每秒,Mbit/s的含义 ...

  10. hash和history的区别

    vue-router 中hash模式和history模式. 在vue的路由配置中有mode选项,最直观的区别就是在url中hash 带了一个很丑的 # ,而history是没有#的.vue默认使用ha ...