怎么在css中設(shè)置橫向?qū)Ш?/h1>

發(fā)布時間：2020-07-20 10:36:13 來源：億速云 閱讀：142 作者：Leah 欄目：web開發(fā)

本篇文章給大家分享的是有關(guān)怎么在css中設(shè)置橫向?qū)Ш剑【幱X得挺實用的，因此分享給大家學習，希望大家閱讀完這篇文章后可以有所收獲，話不多說，跟著小編一起來看看吧。

                                                           導(dǎo)航欄

熟練使用導(dǎo)航欄，對于任何網(wǎng)站都非常重要。

使用CSS你可以轉(zhuǎn)換成好看的導(dǎo)航欄而不是枯燥的HTML菜單。

導(dǎo)航欄=鏈接列表

作為標準的HTML基礎(chǔ)一個導(dǎo)航欄是必須的。

導(dǎo)航條基本上是一個鏈接列表，所以使用 <ul> 和 <li>元素非常有意義：

<ul>
  <li><a href="#home">主頁</a></li>
  <li><a href="#news">新聞</a></li>
  <li><a href="#contact">聯(lián)系</a></li>
  <li><a href="#about">關(guān)于</a></li>
</ul>

li{ display:inline; }

display:inline; -默認情況下，<li>元素是塊元素。在這里，我們刪除換行符之前和之后每個列表項，以顯示一行。

浮動列表項

在上面的例子中鏈接有不同的寬度。

對于所有的鏈接寬度相等，浮動 <li>元素，并指定為 <a>元素的寬度：

實例

li{
    float:left;
}
a{
    display:block;
    width:60px;
}

float:left - 使用浮動塊元素的幻燈片彼此相鄰

display:block - 顯示塊元素的鏈接，讓整體變?yōu)榭牲c擊鏈接區(qū)域（不只是文本），它允許我們指定寬度

width:60px - 塊元素默認情況下是最大寬度。我們要指定一個60像素的寬度

以上就是怎么在css中設(shè)置橫向?qū)Ш?，小編相信有部分知識點可能是我們?nèi)粘９ぷ鲿姷交蛴玫降?。希望你能通過這篇文章學到更多知識。更多詳情敬請關(guān)注億速云行業(yè)資訊頻道。