第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全，請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題，去搜搜看，總會有你想問的

修復(fù)導(dǎo)航欄下拉錯(cuò)誤定位并且只在一個(gè)頁面上工作

修復(fù)導(dǎo)航欄下拉錯(cuò)誤定位并且只在一個(gè)頁面上工作

PHP
慕的地8271018 2022-07-29 15:26:43
所以我一直在為我和我的朋友在學(xué)校制作一個(gè)網(wǎng)站，因?yàn)樗麄冏柚沽艘磺?，所以我制作了自己的聊天系統(tǒng)等。我正在尋找一些幫助來修復(fù)我的導(dǎo)航欄下拉列表，目前不起作用完全沒有，但是 php 中有標(biāo)簽，因?yàn)橛腥丝梢哉埧纯词欠裼幸粋€(gè)很棒的修復(fù)程序！希望這篇文章的答案對尋找相同功能的其他人有用！頭文件.php<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8">        <title>MopedBoyz</title>        <link rel="icon" href="img/mopedIcon.ico">        <link rel="stylesheet" href="css/nav.css">        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">        </head>            <div id="main-navigation" class="animated bounceInDown">            <div class="inner">                <div class="navigation-left">                    <a href="index.php" class="logo bold">MopedBoyz</a>                </div>                <div class="hamburger-menu">                    <div class="bar"></div>                </div>                <div class="navigation-right">                    <a href="index.php" class="item">Links</a>                    <a href="chat.php" class="item">Chat</a>                    <a href="login.php" class="item">Login</a>                    <a href="register.php" class="item">Register</a>                    <a href="usercp.php" class="item">Settings</a>                    <a href="#" class="item hosting-dropdown">Account                     <i class="fa fa-caret-down"></i></a>                        <li class="dropdown">                            <a href="login.php">Login</a>                            <a href="register.php">Register</a>                            <a href="usercp.php">Settings</a>                            <a href="sys/logout.php">Logout</a>                        </li>                    <a href="sys/logout.php" class="button-primary">Logout</a>                </div>            </div>        </div>            
查看完整描述

1 回答

?
湖上湖

TA貢獻(xiàn)2003條經(jīng)驗(yàn) 獲得超2個(gè)贊

如果閱讀您的 3000 行 css 代碼非常困難，但我為您做了一個(gè)工作示例。你可以在jsFiddle上找到它。


我認(rèn)為您應(yīng)該按如下方式構(gòu)建“下拉”容器：


 <ul class="dropdown">

    <li><a href="login.php">Login</a></li>

    <li><a href="register.php">Register</a></li>

    <li><a href="usercp.php">Settings</a></li>

    <li><a href="sys/logout.php">Logout</a></li>

 </ul>

'li' 標(biāo)簽應(yīng)該放在上面的 'ul' 中。


整個(gè)“下拉”容器應(yīng)放置在“主機(jī)下拉”內(nèi)，該“主機(jī)下拉”打開和關(guān)閉“下拉”。因此，您可以調(diào)整“下拉”容器相對于“托管下拉”按鈕的位置。


 <div id="dropdown" class="item hosting-dropdown">

      <span>Account<i class="fa fa-caret-down"></i></span>

      <ul class="dropdown">

          <li><a href="login.php">Login</a></li>

          <li><a href="register.php">Register</a></li>

          <li><a href="usercp.php">Settings</a></li>

          <li><a href="sys/logout.php">Logout</a></li>

     </ul>

 </div>

下拉打開和關(guān)閉可以用一個(gè)jQuery小函數(shù)來實(shí)現(xiàn)：


$('document').ready(function() {

    $('#dropdown').click(function() {

    $(this).toggleClass('opened');

  })

})

和CSS：


.hosting-dropdown { 

  display: inline-block;

  margin-left: 10px;

  position: relative;

  cursor: pointer;

}  


.dropdown {

  position: absolute;

  right: 0;

  top: 55px;

  background-color: rgba(0, 0, 0, 0.4);

  padding: 15px;

  margin: 0;

  display: none; 

}


.hosting-dropdown.opened .dropdown {

  display: block;

}


.dropdown li {

  list-style: none;

  padding: 5px 0;

}


.main-navigation {

  position: fixed;

  top: 0;

  left: 0;

  width: 100%;

  float: left;

}


.content {

  height: 2000px;

  width: 100%;

  background-color:#fff

}


#main-navigation .navigation-left {

  padding: 27px 0;   

}

#main-navigation .navigation-right{

  padding: 35px 0; 

}

如果您有任何問題，請與我聯(lián)系。


查看完整回答
反對 回復(fù) 2022-07-29
  • 1 回答
  • 0 關(guān)注
  • 122 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號