這篇文章帶給大家的內容是關於Dreamweaver中如何使用模板(附程式碼),有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。
範本的作用:
一、有助於維持整個網站外觀與風格的一致性;
#二、在範本中進行修改後,所有套用範本的頁面都會自動更新。
簡單範例:
// 在其.dwt 範本中
<!-- TemplateBeginEditable name="myName" -->
设置可编辑区域
<!-- TemplateEndEditable -->
// 在頁面中,宣告套用範本的位址,以及區域等
<HTML>
<!-- InstanceBegin template="/Templates/myTemplates.dwt" codeOutsideHTMLIsLocked="false" -->
<HEAD>
</BODY>
<!-- InstanceEnd -->
</HTML>
// 在範本區域內,設定可編輯區域
<!-- InstanceBeginEditable name="myName" -->
放入可编辑区域的内容
<!-- InstanceEndEditable -->
767ca6dca3ed56b69fcd1a934804f194edd161f7c09dc7f4b2fcfa3d583076d7
623bf5a311eb01972e3a038461cfe55e
867dc13d4d8dcc76bcbf47e9b5436535
2a58cf4a25e5e67f880b4dc99533add5Templates72c3bc8c17f26d38fb216c7695f0f357
dd41de28e245a8388c4a6b420f832539
1df7737262ad269b94d7418ec096f18fdd41de28e245a8388c4a6b420f832539
de5784feeaad7ae4ffb1e34f1eac6168
00f38c0f8be778c9e9a7d04b5d656541
86376992b71f6f4c9ac52cfc1ce7a5a9
0defae2befe3b122d038ea04b7d5dc31
2ad9b981838a2cbc23e610d74dafbbe8
73a77e6ec55b8f43c0c19fba91875a64
d7d7242aa3fe2ba2b0aab2a7399f4872
bd0ef02a49d9e8a424f05ec6b0ca0f9c
2ad9b981838a2cbc23e610d74dafbbe8
TD>img src="Temp_images/head_1 .gif" >TD>
##TD>img src="Temp_images/head_2.gif">#TD>
# TD#>#img TD#>src="Temp_images/head_3.gif"##>TD
> TR
>
>
#TD>
#TR>
#TR>## TD#> ; ## TABLE #邊框="0" 單元格間距 ="0" cellpadding
="0"> ##TR
> ## ##TD valign="top"#>
########## ############ ####TR>
##. >a href="tempTest_00.html">#img ##s ="Temp_images/left_1.gif" 邊框="0"##>
##a
##>TD
> ##TR> TR> # #TD>a href# ="tempTest_01.html"># img src="Temp_images/left_2.gif"
border##="0"##>a>
TD> #
# #TR> ac45ce7143cb9d02bd8b6323177e6383
#851ec49ff59c84c13c105abf10354269910046bcda732af6450a5291a996eb73
# #b5376c256327609f91e033ca70f1f1bf
73a77e6ec55b8f43c0c19fba91875a64286e148a0ae61dc256bef187b79f886ba3d7de8b0c5c41a3588039351ede40aa
# 22b512e83ce3185a5f75935b3f267550
0e706dc73167789fee48b0c056c3e504
#6cba5baf12a37bcd9608e88b259bbd63abbe1234d672e35aa0c10aaf6a4891e6a3d7de8b0c5c41a3588039351ede40aa
22b512e83ce3185a5f75935b3f267550##
#TABLE> 5dc5bb6302d360b2588b9773f8799a4e 8c6b59341ddf1fd7780b972f78ce9d80 66a778dac73392257283dbde050a4f8f## ##
0c73c33a3d93ef4402115893ded68995 < ;!--
InstanceBeginEditable name="right" #--> # width
="450" border="0"##>
###57f827d9c8254bffea12c08e41a47af8######### ######9bbd401219d575a509b7f3c43f05e41d####### #######ff58527330b312b7c1e5824515281a0b##########td 寬度="450"> defb53f6d91ea72509da3f4c350a7613#> 3553c8f9ae0be001802b1b9912941036 8a3d9cb84e2d3b8768074bc1171c0e0c
23b6731f659f5b51ded23b9990e8bfee 8a3d9cb84e2d3b8768074bc1171c0e0c
23b6731f659f5b51ded23b9990e8bfee 8a3d9cb84e2d3b8768074bc1171c0e0c
672da5ab908bb38fd37e8492cc852bd2
a260abd15b36d9da0b08d8823355e09a
dd41de28e245a8388c4a6b420f832539a3d7de8b0c5c41a3588039351ede40aa
22b512e83ce3185a5f75935b3f267550
bff76c8e7181d720027042fe8b0358c5
a3d7de8b0c5c41a3588039351ede40aa
22b512e83ce3185a5f75935b3f267550
bff76c8e7181d720027042fe8b0358c5
fe2bf1b00e0f3a21cb39d94e2fc72c5f
4bcbeea3dce8d5942ee62f6c993d3c5e
d60c79aa20a75302e1741ffc2e5eae6c“另存为模板”,保存模板;
新建空白模板:
1.选择“窗口”->“资源”命令(或按 F11键)。
2.单击“资源”面板上的“模板”图标,显示“模板”面板。
3.单击“模板”面板右下角的“新建模板”图标。
默认情况下,整个模板都处于锁定状态。
添加可编辑区域:
方法一:
在“插入”栏->“常用”选项卡->“模板”图标->“可编辑区域”;
方法二:
在“插入”->“模板对象”->“可编辑区域”;
方法三:
按Ctrl+Alt+V 组合键;
方法四:
右键选中区域->“模板”->“新建可编辑区域”
删除可编辑区域:
选中编辑区域,“修改”->“模板”->“删除模板标记”,该区域将被锁定,不可编辑。
修改编辑模板:
選擇「視窗」->「資源」->「模板」圖示->選擇要編輯的模板,然後雙擊,該模板將出現在「文件」窗口,此時即可編輯該模板。
對網頁套用範本:
1.開啟要套用範本的文件(即:頁面);
2.選擇「視窗」->「資源」- >「範本」圖示->選擇要套用的範本;
3.將範本從面板拖曳到頁面視窗中(或按一下「套用」按鈕);
4.在可編輯區域中新增或編寫資料;
注意:如果文件中已經有內容,必須將現有內容移到範本的可編輯區域內,否則Dreamweaver將會刪除這些內容!
以上是Dreamweaver中如何使用模板(附程式碼)的詳細內容。更多資訊請關注PHP中文網其他相關文章!