2種方式讓header的高度跟著瀏覽器的高度顯示

利用css 的方式

#header
{
height: 100vh;  /* 高度100vh header高度就會跟著瀏覽器視窗高度去顯示囉 */
background-color:#000;
}

利用 jQuery 的方式

 //利用jQuery抓取視窗高度再將取到的高度賦予#header 的height
function setHeiHeight() {
    $('#header').css({
        height: $(window).height() + 'px' 
    });
}
// 加載頁面時執行上面定義的function
setHeiHeight(); 

// 當拖動視窗時jQuery 也會隨著視窗拖動去執行resize function讓header高度一直跟瀏覽器高度一直保持同步狀態
$(window).resize( setHeiHeight ); 
}