您可以設定焦點，以確保圖片的主要部分不會遭到裁剪。焦點功能特別適合用於回應式版面配置，可讓相同圖片以不同的尺寸顯示。
為背景圖片設定焦點
當您想將圖片設為背景圖片時，尤其適合使用焦點功能。只要將圖片的寬度和高度設為 100%，然後再設定焦點，就能確保系統顯示圖片最重要的部分，不受元素尺寸干擾。
焦點的使用限制：
- 圖片縮放類型：「縮放」屬性必須設為 [裁剪圖片以填滿畫格] 或 [無]。
- 圖片來源類型：圖片必須來自本機，而不是外部網址。
- 動態廣告：動態廣告不支援焦點功能。
- 動畫：您無法建立焦點動畫，但可以為圖片設定焦點。如果圖片大小在動畫播放過程中有所異動，系統會根據初始圖片大小套用焦點。
啟用焦點時會讓對齊選項失效。
設定焦點
- 使用下列其中一種方法來開啟「編輯圖片焦點」對話方塊：
- 選取中心區域的圖片，然後按一下「屬性」面板中的 [啟用焦點] 核取方塊。
- 在圖片上按一下滑鼠右鍵，然後在彈出式選單中選取 [設定焦點...]。
- 將焦點拖曳到需要的位置。
- 根據預設，焦點會位於圖片中心。
- 焦點的控制項會以白色圓圈顯示，方便您辨識及點選，但中心的十字才是真正的焦點。
- 使用鍵盤的方向鍵來移動焦點 (一次移動 1 像素的距離)。
- 如要重設焦點位置，讓焦點回到中心點，請在圖片上按一下滑鼠右鍵，並在彈出式選單中選取 [重設]，或按下 Ctrl + R 鍵 (Windows) 或 ⌘ + R 鍵 (Mac)。
- 切換至「預覽」分頁，查看焦點功能針對不同的圖片長寬比例產生的圖片裁剪效果。
- 按一下 [確定]。
當您變更圖片來源時，Google Web Designer 會詢問您是否要保留、編輯或捨棄焦點。
編輯焦點
您可以變更現有焦點的位置：
- 使用下列其中一種方法來開啟「編輯圖片焦點」對話方塊：
- 在圖片上按一下滑鼠右鍵，然後在彈出式選單中選取 [編輯焦點...]。
- 選取圖片，然後按一下「設定焦點位置」按鈕
(位於「屬性」面板中的 [啟用焦點] 核取方塊旁邊)。
- 將焦點拖曳至新的位置。
- 按一下 [確定]。
切換顯示焦點
您可以停用焦點，改用對齊選項來查看圖片的顯示結果。再次啟用焦點時，Web Designer 會記住先前您為焦點設定的位置。
只要使用下列其中一種方法，即可切換所選圖片的焦點：
- 在「屬性」面板中按一下 [啟用焦點] 核取方塊。
- 在圖片上按一下滑鼠右鍵，然後在彈出式選單中選取 [啟用焦點] 或 [停用焦點]。
移除焦點
- 在圖片上按一下滑鼠右鍵。
- 在彈出式選單中選取 [移除焦點]。
切換成設有焦點的圖片
當您使用 [切換圖片...] 功能或變更已啟用焦點的圖片來源時，可以決定是否要針對新圖片保留相同焦點、編輯焦點，或捨棄焦點。
焦點功能與媒體規則
您無法使用媒體規則變更焦點的位置。如果您想按照可視區域的大小顯示不同圖片，但這些圖片又不能使用相同的焦點，那麼您可以將兩張圖片都放入文件中，再利用媒體規則分別針對不同可視區域大小，將不該顯示的圖片不透明度變更為 0。
以程式碼檢視模式查看焦點
在程式碼檢視模式中，焦點座標位於 gwd-image 元素的 focalpoint 屬性中，例如：
<gwd-image class="gwd-image-1t0s" id="gwd-image_1" scaling="none" source="assets/moon_landscape.jpg" focalpoint="540 295"></gwd-image>