響應式網頁要求設計出來的網頁在不同的顯示裝置（如大屏、普通電腦端、手機端、平闆電腦端）都能自适應顯示。這就要求設計軟體具備響應式網頁設計的能力。金蜘蛛網頁設計器對響應式網頁設計支援非常好，無需要寫任何HTML代碼就能實作。本文介紹一種利用金蜘蛛網頁設計器實作響應式網頁設計的方法，非常簡單實用。上一節說到了Div面闆的響應式設計，本節講圖檔、文本框的響應式設計。
三、圖檔、文本框的響應式設計
1.圖檔的響應式設計
一般在電腦端浏覽器顯示圖檔，由于分辨一般比較大，都會盡量顯示原圖檔大小，如果顯示不了原圖大小也會盡量按比例縮小到一個體驗比較好的大小。這樣一張大小的圖檔到了手機、平闆電腦分辨比較小的裝置顯示如果還按電腦浏覽器設計的大小顯示，就可能會顯示不全了。如果在這些移動裝置下圖檔能自動縮小至裝置的合适顯示的大于，那就完美了。金蜘蛛網頁設計器的圖檔功能就自帶了這個功能。
下面我們以例子說明圖檔對響應式的支援
如下圖，點“建立移動網頁”建立一個空白的網頁（說明：電腦網頁不适應移動裝置下顯示，但移動網頁既可以适應電腦裝置也可以适應移動裝置顯示，是以響應式網頁都要建立移動網頁）。
在這個空白的網中建立一個圖檔，屬性“位置、大小”->“按目前大小比例自适應”為“true”。另外隻把“按原始大小比例自适應”設定為“true”也可以。差別是“按目前大小比例自适應”也可以應用于其他如面闆等控件，而“按原始大小比例自适應”隻适用于圖檔，對于圖檔來說用“按原始大小比例自适應”能確定圖檔不會變形，但從嚴格意義上來說“按目前大小比例自适應”才是真正的響應式，圖檔的可以大小随着浏覽器寬度改變而改變，而“按原始大小比例自适應”隻是打開網頁初始化時執行一次，大小不會随着浏覽器寬度改變而改變，對于移動裝置下沒有問題，因為移動裝置器的浏覽器大小一般改不了。如下圖：
另外，圖檔的對應方式我們一般都采用“水準居中對齊_運作網頁後生效”，如上圖。
如上所述，僅需要把圖檔的屬性“位置、大小”->“按目前大小比例自适應”為“true”可以實作響應圖檔計。 預覽網頁，不斷改小浏覽器的寬度，浏覽器的寬度小到移動設定的寬度後，圖檔寬度就一直是浏覽器寬度的大小；這時再改大浏覽器的寬度，發現圖檔又會随着浏覽器寬度大小而改變，直接到達圖檔原大小後不再改變。如下圖：
注意：圖檔随着浏覽器大小改變而改變需要金蜘蛛網頁設計器 V8.2以上的版本才支援，小于此版本的隻支援圖檔打開初始時自适應浏覽器大小。
2.文本框的響應式設計
文本框的響應式設計首先要把：其屬性“位置、大小”->“自動寬度”、“自動高度”，“自動左邊距”設計為“true”，如果“自動寬度”不設定為“true”的話，則要把“與父寬度同”設定為“true”，效果是一樣的。另外為了測試需要我們把文本框的字型大小改為25，如圖下圖：
預覽網頁，不斷改小浏覽器的寬度，文字會随着浏覽器的寬度改小而自适應，一行裝不下，又起一行，改大浏覽器寬度，也是可以自适應的。如下圖：
大家有沒有發現，文字大小并沒有随着改變。要改變文字大小，需要在“按顯示裝置設定位置、大小、字型大小等”針對不同裝置進行設定。在這裡我們進行了如下圖的設定：
再預覽網頁，不斷改大或改小浏覽器的寬度，在不同裝置的分辨下文字也會随着改變。（說明：字型大小可以是一個百分數或一個固定值，如果是百分數，表示是原字型大小的百分之多少）如下圖：