# 3.3 練習

## 練習：設定某區塊的 Media Query

請建立 **`media_query.html`** 網頁檔，貼以下 codepen 提供的 HTML 和 CSS，並將該區塊按照以下規則設定：

* `div.my_div1` 是一個固定寬 700px 的元素，將 `div.my_div1` 元素設定水平方向置中。(使用 margin 即可)
* 瀏覽器寬度 <= 767.98px 時，`div.my_div1` 的寬度設定成 95%。
* 留意圖片不得超出 `div.my_div1` 的區塊。而且當 `div.my_div1` 的寬度大於圖片寬度時，圖片應維持原圖尺吋。(也就是設定 **圖片預設不要超出父元素**。)

{% embed url="<https://codepen.io/carlos411/pen/poqyXZa>" %}