banner · UI 课程标准教案 V1.0

# Banner > 网站页面的横幅广告，让上下内容有机隔开，也让网页更加美观，一般会采用GIF动画作为 banner。 ## 尺寸我们经常做的是1920px，即全屏界面，建好一个宽度1920px的文档后画两条参考线3600px、15600px，保证主要内容不超过参考线就可以了，参考线中间的宽度是12000px。 ![](https://box.kancloud.cn/620eb132781eadb47ae5509c97a4406f_800x651.png) ## 制作流程 ![](https://box.kancloud.cn/49db87f4295438d1018ce9271ecfac4a_800x450.jpg) ![](https://box.kancloud.cn/d5ceaa0301cf37162bd90f4c996faa02_800x450.jpg) ![](https://box.kancloud.cn/6d7107999027921c3f4407d0a65ca854_800x450.jpg) ![](https://box.kancloud.cn/9ae6a03689ce0fd2ffddb3ad217ca045_800x450.jpg) ![](https://box.kancloud.cn/1021b38bd0e867e72fc8c7bcac5b033c_800x450.jpg) ![](https://box.kancloud.cn/ab469a6774b302954252cb5d80fa8a62_800x450.jpg) ![](https://box.kancloud.cn/dbf412637b086de84feaf03399f0b898_800x450.jpg) ![](https://box.kancloud.cn/3f6ac0c7252cb32fad1b4eb8dbc8b8e4_800x450.jpg) ![](https://box.kancloud.cn/bb224d9de5ceee796289ec26d385aa9a_800x450.jpg) ![](https://box.kancloud.cn/862c1896d6c6335f2c96ba51c8f9d10d_800x450.jpg) ![](https://box.kancloud.cn/f57855df3ad4cf72a6910a1d77a4aba7_800x450.jpg) ![](https://box.kancloud.cn/ee92e81b49c70d28d421386036068a85_800x450.jpg) ![](https://box.kancloud.cn/cb71d598499ef7e699f16384ff9c270f_800x450.jpg) ![](https://box.kancloud.cn/8bccad291391f4cca7c61b3af15017b6_800x450.jpg) ![](https://box.kancloud.cn/d846619d81c7ac3d9b6e89dd757747e4_800x450.jpg) ![](https://box.kancloud.cn/e0e4b8e302334a16a647991bb11db90f_800x450.jpg) ![](https://box.kancloud.cn/d4ed1725ae95ec9c8c0c510c5c2f0192_800x450.jpg) ![](https://box.kancloud.cn/f75730cbc74229b8af6f01377aede8ec_800x450.jpg) ![](https://box.kancloud.cn/111d3169984069a72e4942a8200d5606_800x450.jpg) ![](https://box.kancloud.cn/21df5d259422eacc13a685af33be80a6_800x450.jpg) ![](https://box.kancloud.cn/a71393d2ef68564a3bf366fb39aceeb0_800x450.jpg) ![](https://box.kancloud.cn/09766828a320b6010105e991cffa28b9_800x450.jpg)