本文目錄導(dǎo)讀：

1. 使用display屬性
2. 使用visibility屬性
3. 使用position屬性

隱藏界面CSS的方法

在網(wǎng)頁(yè)設(shè)計(jì)中，有時(shí)我們需要隱藏某些界面元素，比如導(dǎo)航欄、側(cè)邊欄等，以?xún)?yōu)化用戶(hù)體驗(yàn)或?qū)崿F(xiàn)特定功能，這時(shí)，我們可以使用CSS（層疊樣式表）來(lái)實(shí)現(xiàn)隱藏界面的效果。

使用display屬性

CSS中的display屬性可以用來(lái)設(shè)置元素的顯示方式，我們可以通過(guò)設(shè)置display屬性為none來(lái)隱藏界面元素。

#navbar {
  display: none;
}

上述代碼將隱藏id為navbar的元素，即導(dǎo)航欄。

使用visibility屬性

除了display屬性外，我們還可以使用visibility屬性來(lái)設(shè)置元素的可見(jiàn)性，與display屬性不同，visibility屬性只會(huì)影響元素的可見(jiàn)性，而不會(huì)改變?cè)氐牟季只虼笮　?/p>

#sidebar {
  visibility: hidden;
}

上述代碼將隱藏id為sidebar的元素，即側(cè)邊欄。

使用position屬性

我們還可以使用position屬性來(lái)設(shè)置元素的定位方式，通過(guò)將元素設(shè)置為***定位（absolute）或固定定位（fixed），我們可以將元素固定在頁(yè)面的某個(gè)位置，從而實(shí)現(xiàn)隱藏界面的效果。

#footer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50px;
  background-color: #333;
  color: #fff;
  text-align: center;
  line-height: 50px;
}

上述代碼將固定id為footer的元素在頁(yè)面的底部，并設(shè)置其背景顏色和文字顏色，由于該元素是***的定位，因此不會(huì)受到其他元素的影響，從而實(shí)現(xiàn)隱藏界面的效果。