頁面拆分，以及登錄的實現(8月3號)

時間 2019-11-19

標籤頁面拆分以及登錄實現 8月简体版

原文原文鏈接

一頁面拆分html

1 將頁面的頂部，頭部，菜單欄和頁面底部拆分出來，以便更多頁面使用，減小代碼量java

將主頁的頂部，頭部，菜單欄和頁面底部拆分出來變成獨立的頁面，將下面的代碼引入到主頁spa

<body>
	<div class="top">
	        <div th:replace="shop/topBar :: page-top-bar"></div>
	</div>
     <div class="header">
	        <div th:replace="shop/header :: page-header"></div>
	</div>
	<!-- header over -->
	<div class="menubar">
	        <div th:replace="shop/menuBar :: page-menu-bar"></div>
	</div>
	<!-- nav over -->
	<div class="banner">
	    <ul>
	        <li><a href="##"><img src="images/001.jpg" alt=""/></a></li>
	        <li><a href="##"><img src="images/002.jpg" alt=""/></a></li>
	        <li><a href="##"><img src="images/003.jpg" alt=""/></a></li>
	        <li><a href="##"><img src="images/004.jpg" alt=""/></a></li>
	    </ul>
	</div>
<div class="footer">
	        <div th:replace="shop/footer :: page-footer"></div>
	</div>

注意：拆分時注意頭文件的寫法和文件名的使用，以及標記對的使用code

在topBar.html頁面中的class文件換成:<div th:fragment="page-top-bar">htm

其餘幾個頁面也照例修改it

登錄和註冊添加連接，連接到登錄和註冊頁面，在topBar.html文件中：您好，請 <a th:href="@{initGuestLogin}" class="link">登陸</a>|<a th:href="@{initGuestRegister}" class="link">註冊</a>|<a href="#" class="link">分銷商入口</a>
class

注意：login頁面的頭文件，和代碼中的標記對和文件名的修改
登錄

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。