---
# System prepended metadata

title: Week 11(11/20)

---

# Week 11(11/20)：實用網頁設計技巧(1)
## parallex
可直接下載Material CSS的parallex template使用，但如要更改圖片則須修改原程式碼。

做法：
```html=
<!--原尾部程式-->
<!--  Scripts-->
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="js/materialize.js"></script>
<script src="js/init.js"></script>

<!--修改後程式碼-->
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="js/materialize.js"></script>
<script>
    $(document).ready(function(){
        $('.parallax').parallax();
    });
</script>
```
更多相關資料：https://materializecss.com/parallax.html

## 圖片點按放大
為Meterial CSS中的Media。
可照以下網址介紹操作：https://materializecss.com/media.html

## 跳出文字窗格
為Meterial CSS中的Modals。
照以下網址介紹操作：https://materializecss.com/modals.html

## 可折疊列表
為Meterial CSS中的Collapsible。
照以下網址介紹操作：https://materializecss.com/collapsible.html