使用手冊 取消

辨識範本和以範本為架構的文件

 

 

了解如何在 Dreamweaver 的「設計」檢視和「程式碼」檢視中辨識範本和以範本為架構的文件。

辨識設計檢視中的範本

在「設計」檢視中,可編輯區域會出現在「文件」視窗中,周圍有矩形外框圍繞。請查看「文件」視窗中的底部窗格,以檢視區域的名稱。

您可以查看「文件」視窗的標題列,以辨識檔案是否為範本檔。檔案的副檔名為 .dwt。

辨識設計檢視中的範本
辨識設計檢視中的範本

在「程式碼」檢視中辨識範本

在「程式碼」檢視中,可編輯內容的區域是以下列的 HTML 註解來標示:

<!-- TemplateBeginEditable><!-- TemplateEndEditable -->

註解:

您可以使用程式碼色彩標示偏好設定來設定自己的配色,以便在「程式碼」檢視中檢視文件時可以很容易地辨別範本區域。

在以範本為架構的文件中,這些註解之間的所有內容都是可以編輯的。可編輯區域的 HTML 原始碼應該類似這樣:

<table width="75%" border="1" cellspacing="0" cellpadding="0">
<tr bgcolor="#333366">
<td>Name</td>
<td><font color="#FFFFFF">Address</font></td>
<td><font color="#FFFFFF">Telephone Number</font></td>
</tr>
<!-- TemplateBeginEditable name="LocationList" -->
<tr>
<td>Enter name</td>
<td>Enter Address</td>
<td>Enter Telephone</td>
</tr>
<!-- TemplateEndEditable -->
</table>
<table width="75%" border="1" cellspacing="0" cellpadding="0"> <tr bgcolor="#333366"> <td>Name</td> <td><font color="#FFFFFF">Address</font></td> <td><font color="#FFFFFF">Telephone Number</font></td> </tr> <!-- TemplateBeginEditable name="LocationList" --> <tr> <td>Enter name</td> <td>Enter Address</td> <td>Enter Telephone</td> </tr> <!-- TemplateEndEditable --> </table>
<table width="75%"  border="1"  cellspacing="0" cellpadding="0"> 
  <tr bgcolor="#333366"> 
    <td>Name</td> 
    <td><font color="#FFFFFF">Address</font></td> 
    <td><font color="#FFFFFF">Telephone Number</font></td> 
  </tr> 
  <!-- TemplateBeginEditable name="LocationList" --> 
  <tr> 
    <td>Enter name</td> 
    <td>Enter Address</td> 
    <td>Enter Telephone</td> 
  </tr> 
  <!-- TemplateEndEditable --> 
</table>
註解:

當您在「程式碼」檢視中編輯範本程式碼時,請小心不要變更 Dreamweaver 所依據的任何範本註解標籤。

在設計檢視中辨認以範本為架構的文件

在以範本為架構的文件中,可編輯區域會出現在「文件」視窗的「設計」檢視中,周圍有矩形的虛線外框圍繞。視窗底部會顯示區域的名稱。

除了可編輯區域的外框之外,整個頁面周圍也環繞不同顏色的外框,右上方會有一個標籤,顯示出該文件所依據之範本的名稱。這個反白標示的矩形是希望提醒您,這個文件是以範本為架構,您無法變更可編輯區域外面的任何項目。

在「程式碼」檢視中辨識以範本為架構的文件

在「程式碼」檢視中,從範本衍生的文件可編輯區域會以不同於不可編輯區域中程式碼的顏色顯示。您只能變更可編輯區域中的程式碼或可編輯參數;但是您不能在鎖定區域內輸入。

可編輯內容是以下列 Dreamweaver 的 HTML 註解來標示:

<!‑‑ InstanceBeginEditable><!‑‑ InstanceEndEditable ‑‑>

在以範本為架構的文件中,這些註解之間的所有內容都是可以編輯的。可編輯區域的 HTML 原始碼應該類似這樣:

<body bgcolor="#FFFFFF" leftmargin="0">
<table width="75%" border="1" cellspacing="0" cellpadding="0">
<tr bgcolor="#333366">
<td>Name</td>
<td><font color="#FFFFFF">Address</font></td>
<td><font color="#FFFFFF">Telephone Number</font></td>
</tr>
<!-- InstanceBeginEditable name="LocationList" -->
<tr>
<td>Enter name</td>
<td>Enter Address</td>
<td>Enter Telephone</td>
</tr>
<!-- InstanceEndEditable -->
</table>
</body>
<body bgcolor="#FFFFFF" leftmargin="0"> <table width="75%" border="1" cellspacing="0" cellpadding="0"> <tr bgcolor="#333366"> <td>Name</td> <td><font color="#FFFFFF">Address</font></td> <td><font color="#FFFFFF">Telephone Number</font></td> </tr> <!-- InstanceBeginEditable name="LocationList" --> <tr> <td>Enter name</td> <td>Enter Address</td> <td>Enter Telephone</td> </tr> <!-- InstanceEndEditable --> </table> </body>
<body bgcolor="#FFFFFF" leftmargin="0"> 
<table width="75%"  border="1"  cellspacing="0" cellpadding="0"> 
  <tr bgcolor="#333366"> 
    <td>Name</td> 
    <td><font color="#FFFFFF">Address</font></td> 
    <td><font color="#FFFFFF">Telephone Number</font></td> 
  </tr> 
  <!-- InstanceBeginEditable name="LocationList" --> 
  <tr> 
    <td>Enter name</td> 
    <td>Enter Address</td> 
    <td>Enter Telephone</td> 
  </tr> 
  <!-- InstanceEndEditable --> 
</table> 
</body>

無法編輯的文字,預設的顏色是灰色;您可以在「偏好設定」對話方塊中,針對可編輯和不可編輯區域分別選取不同的顏色。

更快、更輕鬆地獲得協助

新的使用者?