css圖片自適應(yīng)
之前都是用background-size:cover爬早，但是有個(gè)問(wèn)題。
全屏效果：
縮小一半后：
用了cover，自適應(yīng)原來(lái)是從左上角開(kāi)始縮放的柿顶。右邊就被截掉了祈秕。
試試
background-repeat: no-repeat;
background-size: 100% 100%;
結(jié)果渺贤，真是自適應(yīng)，寬高全部縮放
但是如果圖片比例不一致的話请毛，很容易變行志鞍。。
沒(méi)辦法試試
background:url(pp/contact.jpg) no-repeat center center fixed;
background-size: cover;
好吧方仿，還是切割了固棚，不過(guò)以圖片中心縮放统翩，還可以接受。具體用那種方法要具體看圖片了此洲。
滾動(dòng)視差效果
很炫酷的一個(gè)特效厂汗。
具體是用了background-attachment:fixed實(shí)現(xiàn)。將背景圖相對(duì)于windows窗口固定呜师，再來(lái)回切換娶桦，可以實(shí)現(xiàn)這種視差效果，很簡(jiǎn)單的汁汗。
html頁(yè)面內(nèi)跳轉(zhuǎn)
比如導(dǎo)航條有個(gè) 作品 按鈕衷畦，頁(yè)面有一部分是展示作品的，那么就可以用錨點(diǎn)來(lái)實(shí)現(xiàn)頁(yè)面內(nèi)跳轉(zhuǎn)知牌。
具體代碼如下：
<a href="#homes">作品</a>
<a name="homes"></a>
使用<a name="homes"></a>創(chuàng)建一個(gè)錨點(diǎn)祈争，使用<a href="#homes"></a>跳轉(zhuǎn)到錨點(diǎn)。
