<a href="http://www.mamicode.com/details.html" th:href="http://www.mamicode.com/@{/order/details(orderId=${o.id})}">view</a>

<img src="http://www.mamicode.com/static/assets/images/qr-code.jpg" th:src="http://www.mamicode.com/@{${path}}" alt="二维码" />

 　　<dt>价格</dt>
  　 <dd th:text="${#numbers.formatDecimal(product.price, 1, 2)}">180</dd>
　　 <dt>进货日期</dt>
　　 <dd th:text="${#dates.format(product.availableFrom, ‘yyyy-MM-dd‘)}">2014-12-01</dd>

<dd th:text="${‘$‘+product.price}">235</dd>

<div th:text="${html}">

　　This is an <em>HTML</em> text. <b>Enjoy yourself!</b>

</div> 
<div th:utext="${html}">

　　This is an <em>HTML</em> text. <b>Enjoy yourself!</b>

</div>

<form th:action="@{/bb}" th:object="${user}" method="post" th:method="post">

    <input type="text" th:field="*{name}"/>
    <input type="text" th:field="*{msg}"/>

    <input type="submit"/>
</form>

//用 th:remove 移除除了第一个外的静态数据，用第一个tr标签进行循环迭代显示
　　　　<tbody th:remove="all-but-first">
　　　　　　　　　　//将后台传出的 productList 的集合进行迭代，用product参数接收，通过product访问属性值
                <tr th:each="product:${productList}">
　　　　　　　　　　　　//用count进行统计，有顺序的显示
　　　　　　　　　　　　<td th:text="${productStat.count}">1</td>
                    <td th:text="${product.description}">Red Chair</td>
                    <td th:text="${‘$‘ + #numbers.formatDecimal(product.price, 1, 2)}">$123</td>
                    <td th:text="${#dates.format(product.availableFrom, ‘yyyy-MM-dd‘)}">2014-12-01</td>
                </tr>
                <tr>
                    <td>White table</td>
                    <td>$200</td>
                    <td>15-Jul-2013</td>
                </tr>
                <tr>
                    <td>Reb table</td>
                    <td>$200</td>
                    <td>15-Jul-2013</td>
                </tr>
                <tr>
                    <td>Blue table</td>
                    <td>$200</td>
                    <td>15-Jul-2013</td>
                </tr>
      </tbody>

<span th:if="${product.price lt 100}" class="offer">Special offer!</span>

<!-- 当gender存在时，选择对应的选项；若gender不存在或为null时，取得customer对象的name-->
<td th:switch="${customer.gender?.name()}">
    <img th:case="‘MALE‘" src="http://www.mamicode.com/images/male.png" th:src="http://www.mamicode.com/@{/images/male.png}" alt="Male" /> <!-- Use "/images/male.png" image -->
    <img th:case="‘FEMALE‘" src="http://www.mamicode.com/images/female.png" th:src="http://www.mamicode.com/@{/images/female.png}" alt="Female" /> <!-- Use "/images/female.png" image -->
    <span th:case="*">Unknown</span>
</td>

<!--在页面先显示，然后再在显示的数据基础上进行修改-->
<div class="form-group col-lg-6">
    <label>姓名<span>&nbsp;</span></label>
 　　<！--除非resume对象的name属性值为null，否则就用name的值作为placeholder值-->
    <input type="text" class="form-control" th:unless="${resumes.name} eq ‘‘ or ${resumes.name} eq null"  
           data-required="true" th:placeholder="${resumes.name}" />
　　 <!--除非resume对象的name属性不为空，否则就定义一个field方便封装对象，并用placeholder提示-->
    <input type="text" th:field="${resume.name}" class="form-control" th:unless="${resumes.name} ne null" 
           data-required="true" th:placeholder="请填写您的真实姓名"  />
</div>

<!-- 增加class="enhanced"当balance大雨10000 -->
<td th:class="${customer.balance gt 10000} ? ‘enhanced‘" th:text="${customer.balance}">350</td>

 <div class="form-group col-lg-6">
      <label >性别<span>&nbsp;Sex:</span></label>
      <select th:field="${resume.gender}" class="form-control" th:switch="${resumes.gender.toString()}"
            data-required="true">
              <option value="http://www.mamicode.com/男" th:case="‘男‘" th:selected="selected" >男</option>
              <option value="http://www.mamicode.com/女" th:case="‘女‘" th:selected="selected" >女</option>
              <option value="">请选择</option>
      </select>
 </div>

<div class=‘form-group col-lg-4‘>
          <select class=‘form-control‘ name="skill[4].proficiency">
                <option >掌握程度</option>
                <option th:if="${skill.level eq ‘一般‘}" th:selected="selected">一般</option>
                 <option th:if="${skill.level eq ‘熟练‘}" th:selected="selected">熟练</option>
                 <option th:if="${skill.level eq ‘精通‘}" th:selected="selected">精通</option>
           </select>
</div>

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <title>Thymeleaf tutorial: exercise 10</title>
        <link rel="stylesheet" href="http://www.mamicode.com/css/main-static.css" th:href="http://www.mamicode.com/@{/css/main.css}" />
        <meta charset="utf-8" />
    </head>
    <body>
        <h1>Thymeleaf tutorial - Solution for exercise 10: Spring Expression language</h1>
  
        <h2>Arithmetic expressions</h2>
        <p class="label">Four multiplied by minus six multiplied by minus two module seven:</p>
        <p class="answer" th:text="${4 * -6 * -2 % 7}">123</p>
 
        <h2>Object navigation</h2>
        <p class="label">Description field of paymentMethod field of the third element of customerList bean:</p>
        <p class="answer" th:text="${customerList[2].paymentMethod.description}">Credit card</p>
 
        <h2>Object instantiation</h2>
        <p class="label">Current time milliseconds:</p>
        <p class="answer" th:text="${new java.util.Date().getTime()}">22-Jun-2013</p>
        
        <h2>T operator</h2>
        <p class="label">Random number:</p>
        <p class="answer" th:text="${T(java.lang.Math).random()}">123456</p>
    </body>
</html>

<label for="body">Message body:</label>
<textarea id="body" name="body" th:inline="text">
Dear [[${customerName}]],

it is our sincere pleasure to congratulate your in your birthday:
    Happy birthday [[${customerName}]]!!!

See you soon, [[${customerName}]].

Regards,
    The Thymeleaf team
</textarea>

/*<![CDATA[*/
……
/*]]>*/

/*[+
var msg = ‘This is a working application‘;
+]*/

/*[- */
var msg = ‘This is a non-working template‘;
/* -]*/