傳智播客旗下品牌:|||||

全國咨詢/投訴熱線:400-618-4000

HTML網站模板怎么制作?[web前端開發培訓]

更新時間:2019年12月13日14時23分 來源:傳智播客

動態網站需要將網頁的各部分靜態模塊拆外,制作成HTML模板,然后通過PHP代碼調用、生成新的頁面。例如在路徑chapter\ww.itheima到文件夾ww.itheima.com,清空里面的文件。將css, images, template,javascrip文件夾復制到該目錄下。然后創建一個html文件夾,用于存放拆分的html模板。接下來分別創建header.hml (用于存放首頁頭部和nav模塊)、 index.html (用于存放首頁banner, content等內容), footer.himl (用于存放首頁的底部版權)、 login.html (用于存放網站登錄頁表單內容)、 register.hml (用于存放網站注冊頁表單內容)、 loginhead.html (用于存放注冊頁和登錄頁頭部的共有模塊),具體介紹如下。

1576207654177_前端6.jpg

1、  header。html

該頁面主要用于存放網站的首頁頭部和nav模塊,該結構代碼和首頁靜態頁面的結構代碼基本相同,差別在于多出了一些PHP代碼,具體代碼如下:

         <?php

         if(isset($message)){

                   echo'<script type="text/javascript">alert("'。$message。'");

                   </script>

         }

         ?>

當PHP遇到錯誤時,例如驗證用戶輸入的密碼有誤,這段代碼用于將錯誤信息用JavaScript中的警告框彈出,提醒用戶。同時header.html在登錄、注冊模塊還嵌套了一些PHP代碼,具體代碼如下:
         <?php if(empty($_SESSION['user'])){?>

                   <div id="test">

                            <span></span>

                            <a href="login。php">登錄</a>

                            <em></em>

                   </div>

                   <div id="lx">

                            <span></span>

                            <a href="register。php">注冊</a>

                   </div>

                   <?php}else{?>

                   歡迎您,<?.php echo

                   htmlspecialchars($_SESSION['uesr']);?> <a href="logout.php">退出</a>

         <?php}?>

該段代碼同于獲取登錄時用戶信息,并將用戶信息顯示到首頁中。

2、  index.html

該頁面主要用于存放banner、content等內容,該結構代碼和首頁靜態頁面代碼基本相同,只是在頭部和尾引入了PHP代碼,具體代碼如下:

<?php require'./html/header.html'; ?>

<?php require.html/footer.html'; ?>

3、footer。html

該頁面主要用于存放首頁底部的版權內容,該結構代碼和首頁靜態頁面代碼基本相同。

4、login.html

該頁面主要用于存放登錄頁面表單模塊,該頁面添加了method和name屬性的表單代碼,和靜態登錄頁面的表單代碼基本相似。不同的是該代碼頭部添加了如下所示的PHP代碼:

<?php require’./html/loginhead.html'; ?>

上述代碼用于引入登錄頁和表單頭部模板。

5.register.html

該頁面主要用于存放注冊頁表單模塊,該結構代碼同樣添加了method和name屬性的表單代碼,和靜態注冊頁的表單代碼基本相似。并且register.html頁面也要添加和login.html相同的PHP引入代碼。

6、loginheader。html

該頁面主要用于存放注冊頁和登錄頁頭部的公共模塊,改結構代碼添加了和header代碼系相同的PHP驗證碼,具體代碼如下:

<?php

         if(isset($message)){

                   echo'<script type="text/javascript">alert("'.$message.'");

                   </script>

         }

 ?>

當php遇到錯誤時,這段代碼用于將錯誤信息用于JavaScript中的警告框彈出。

以上我們介紹了,制作html模板的方法,希望對您有所幫助。如果想系統深入系統學習知識,可以了解黑馬web前端培訓課程。

足球盈亏指数 支付宝网赚活动真实吗 2019网赚好项目 2019网赚游戏 网赚论坛排行榜 乐彩网 什么网赚稳定收入 福彩3D 2019网赚项目 网赚论坛大全