在 Windows 下，大家都用什么網(wǎng)頁(yè)編輯器（所見(jiàn)即所得那種）?

時(shí)間：2024-02-12 15:15:02 | 來(lái)源：網(wǎng)站運(yùn)營(yíng)

時(shí)間：2024-02-12 15:15:02 來(lái)源：網(wǎng)站運(yùn)營(yíng)

在 Windows 下，大家都用什么網(wǎng)頁(yè)編輯器（所見(jiàn)即所得那種）?：金蜘蛛網(wǎng)頁(yè)編輯器的快捷鍵













金蜘蛛網(wǎng)頁(yè)編輯器的常用操作

1.全選控件

選中待選擇的控件的父控件，按ctrl_+a，或點(diǎn)







，則全選該控件上的所有子控件。

2.調(diào)整控件順序

每個(gè)控件的上方都有一個(gè)紅色的數(shù)字，表示生成該元素的順序。有時(shí)需要在兩個(gè)控件中間插入一個(gè)新控件，你會(huì)發(fā)現(xiàn)這個(gè)新控件上方的數(shù)字會(huì)大于這兩個(gè)控件上方的數(shù)字，生時(shí)網(wǎng)頁(yè)時(shí)也會(huì)排在這兩個(gè)控件之后，這時(shí)，我們就要使用調(diào)整控件順序的功能。方法：先選擇父控件，然后全選所有子控件。點(diǎn)







，則會(huì)提示“恭喜，調(diào)整成功！”。 這里你會(huì)發(fā)現(xiàn)新控件上方的紅色數(shù)字已改變。先后排序規(guī)則：頂邊距越小越排前面，頂邊距相同的，左邊距越小越排前面。

3.對(duì)齊控件或批量改變控件大小

假如我們已選擇了多個(gè)控件，想要讓這些控件左邊對(duì)齊，這時(shí)我們可以點(diǎn)







。 圖中從左到右按鈕作用：左對(duì)齊、頂對(duì)齊、底對(duì)齊、右對(duì)齊 | 把所選的控件按最小寬度設(shè)置、把所選的控件按最大寬度設(shè)置、把所選的控件按最小高度設(shè)置、把所選的控件按最大高度設(shè)置 | 把所選的控件水平等距對(duì)齊，把所選的控件垂直等距對(duì)齊，把所選的控件水平居中對(duì)齊，把所選的控件垂直等距對(duì)齊。 溫馨提示：多選控件后，把鼠標(biāo)移到按鈕上面秒停一會(huì)就會(huì)有提示該按鈕的作用。

4.“文本框”控件內(nèi)容的編輯

文本框的內(nèi)容編輯，最簡(jiǎn)單就是選中該文本框后從左邊的屬性表中直接編輯“文本內(nèi)容”或“多行文本內(nèi)容”。另一方法是雙擊文檔框，進(jìn)入多媒體編輯窗口。在多媒體編輯窗口，可以再以網(wǎng)頁(yè)形式編輯該內(nèi)容。在實(shí)際使用中這兩種方法可以配合使用。其他有文本內(nèi)容的使用方法類同，如多行文本輸入框。

5.選擇圖片

插入圖片控件后，可以雙擊直接打開(kāi)圖片選擇框選擇圖片。

6.SVG矢量圖片

SVG矢量圖片控件，我們提供了龐大的圖片庫(kù)，可以雙擊該控件在彈出的窗口中選擇所需要的圖片。選擇后圖片后，還可以在屬性窗口中改變圖片的顏色、大小。 說(shuō)明：由于所用顯示SVG圖片控件有些問(wèn)題，有些復(fù)雜的SVG圖片可能在選擇時(shí)顯示不完整，但并不影響在網(wǎng)頁(yè)中使用，可以預(yù)覽網(wǎng)頁(yè)看效果。

7.復(fù)制網(wǎng)頁(yè)

我們?cè)谠O(shè)計(jì)完成一個(gè)網(wǎng)頁(yè)后，再做一個(gè)網(wǎng)頁(yè)，這個(gè)新網(wǎng)頁(yè)和前一個(gè)除了具體內(nèi)容外其他的差不多，這時(shí)最簡(jiǎn)單的方法就是直接復(fù)制前一個(gè)網(wǎng)頁(yè)來(lái)修改。復(fù)制網(wǎng)頁(yè)方法：先創(chuàng)建一個(gè)空白的新網(wǎng)頁(yè)，然后從左邊工程樹(shù)中選中這個(gè)網(wǎng)頁(yè)，再點(diǎn)復(fù)制網(wǎng)頁(yè)按鈕，如下圖：



點(diǎn)復(fù)制網(wǎng)頁(yè)按鈕后，會(huì)彈出選擇被復(fù)制的網(wǎng)頁(yè)窗口，選擇好后再點(diǎn)確定即可。

8.使用“插入網(wǎng)頁(yè)模板”控件

比如同一網(wǎng)站不同的網(wǎng)頁(yè)的頭部、尾部基本是相同的，這時(shí)我們可以先建好頭部模板、尾部模板，然后再在這些網(wǎng)頁(yè)中分別插入模板即可。哪天要改頭部或尾部?jī)?nèi)容時(shí)，直接改這兩個(gè)模板即可，非常方便，不需要每個(gè)網(wǎng)頁(yè)都修改。基本于這種思想，所有網(wǎng)頁(yè)中具有相同的內(nèi)容的都可以使用模板，不只是網(wǎng)頁(yè)的頭部、尾部。使用模板方法(以頭部模板為例)：1.先建一個(gè)名稱為“head_mod”的網(wǎng)頁(yè)，編輯設(shè)計(jì)好所需要的頭部?jī)?nèi)容。2.在所需要該模板的網(wǎng)頁(yè)相應(yīng)的位置插入一個(gè)“插入網(wǎng)頁(yè)模板”控件。3.在該“插入網(wǎng)頁(yè)模板”控件的屬性“模板路徑”中填寫“head_mod”?！澳０迓窂健敝С窒鄬?duì)路徑編寫，如“../模板/head_mod”，表示該模板位于與父文件夾同級(jí)的“模板”文件中。切記：一旦模板被引用，請(qǐng)勿修改控件的名字，如果要修改，可以修改“id值和name值”。

9.使用“插入網(wǎng)頁(yè)模板”控件后，修改模板中的控件

在網(wǎng)頁(yè)中插入“插入網(wǎng)頁(yè)模板”控件后，還想修改模板中的某個(gè)屬性值。如本網(wǎng)頁(yè)為“快捷鍵及常用操作”，左邊文檔樹(shù)為模板，要想讓“快捷鍵及常用操作”選中，表示從樹(shù)中知道本頁(yè)是“快捷鍵及常用操作”。操作如下：雙擊左邊文檔樹(shù)模板，在彈出的窗口中，選中“快捷鍵及常用操作”文本框，修改其屬性“選中”為“true”，“更多屬性”->“使用模板屬性值”設(shè)置為“false”（這個(gè)屬性修改非常重要）。修改完成后點(diǎn)“保存”返回即可。

10.快速打開(kāi)工程所在文件夾

雙擊工程樹(shù)工程結(jié)點(diǎn)或文件夾結(jié)點(diǎn)即可打開(kāi)所在文件夾。

11.快速打開(kāi)“預(yù)覽輸出路徑”

在工程樹(shù)中點(diǎn)鼠標(biāo)右鍵，選擇【打開(kāi)“預(yù)覽輸出路徑”】。

12.變量%Main_Path使用

在設(shè)計(jì)網(wǎng)頁(yè)時(shí)，有時(shí)我們并不知道主域名是什么，在編寫連接時(shí)我們就會(huì)用相對(duì)路徑表示。但是比如頁(yè)頭往往會(huì)做成網(wǎng)頁(yè)模板給其他頁(yè)面引用，模板中的連接如果用以往的相對(duì)路徑表示的話，不同級(jí)次文件夾下的網(wǎng)頁(yè)引用可能會(huì)導(dǎo)致連接訪問(wèn)有問(wèn)題，因?yàn)橄鄬?duì)路徑是指定了父文件夾的級(jí)次關(guān)系的。這時(shí)在設(shè)計(jì)階段我們就可以用變量%Main_Path解決這個(gè)問(wèn)題。如某個(gè)連接設(shè)置為“%Main_Path/image/a.png”，假如主域名為 http://www.wyeditor.com，那么實(shí)際生成網(wǎng)頁(yè)后，無(wú)論在哪文件夾下，生成的訪問(wèn)網(wǎng)址都是:http://www.wyeditor.com/image/a.png 。
注意：在不需要編輯解釋的地方，當(dāng)然你也可以使用“/”開(kāi)頭的相對(duì)路徑。