下拉列表html&；css_Html_Css - Fatal编程技术网

下拉列表html&；css

html css

下拉列表html&；css,html,css,Html,Css,我正在为自己做一个网站，我想做一个droplist菜单，你知道当你在“联系人”上停留时，它会删除其他选项，比如“Web开发者”和“支持”&这类东西，但我不知道我做错了什么。。。以下是原始代码：（CSS）下面是索引的HTML代码： <!DOCTYPE html> <html> <head> <title>Moj svet</title> <meta

我正在为自己做一个网站，我想做一个droplist菜单，你知道当你在“联系人”上停留时，它会删除其他选项，比如“Web开发者”和“支持”&这类东西，但我不知道我做错了什么。。。以下是原始代码：（CSS）

下面是索引的HTML代码：

    <!DOCTYPE html>
    <html>
        <head>
            <title>Moj svet</title>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <link href="mojcss.css" rel="stylesheet" type="text/css" >

        </head>
        <body>
            <div id="menu">
        <ul>
            <li><a href="index.html" class="current_page_item" >Domov</a>
            <li><a href="Igre.html">Igre</a></li>
            <li><a href="robotika.html">Robotika</a></li>
            <li><a href="about.html">O meni</a></li>
            <li><a href="contact.html">Kontakt</a></li>
        </ul>
    </div>     
            <div id="wrapper">
    <div id="header">
        <div id="logo">
                <p><img src="images/v8.jpg" alt="logotip"></p>
            <h1><a href="#">Welcome, to my world*</a></h1>
            <p>&nbsp;</p>
        </div>
        <div id="rss"></div>
    </div>
    <div id="page">
        <div id="ads"><img src="images/img2.png" alt="" width="220" height="600" /></div>
        <div id="content">
            <div class="post">
                <div class="title">
                    <h2><a href="#">Doma</a></h2>
                    <p>&nbsp;</p>
                </div>
                <div class="entry">
                    <p>To je domača stran, moje osebne spletne strani</p>
                </div>
            </div>
            <div class="post">
                <div class="title">
                    <h2><a href="#">Spoznajte me</a>            </h2>
                </div>
                <div class="entry">
                  <h3>Interaktivno</h3>
                  <blockquote>
                    <p>Spoznajte me, skozi mojo spletno stran, tukaj!.</p>
                  </blockquote>
                </div>
            </div>
        </div>
    </div>
                <div id="footer">
        <p>&copy;2013 Aljaž Šešo*. All Rights Reserved.</p>
</div>
</div>
        <div align=center></div>
    </body>
</html>


莫伊斯维特










对我来说，这是一个好消息
卡蒂夫诺酒店
斯波兹纳杰，斯柯兹莫霍，斯普莱特诺，图卡吉
&抄袭；2013年AljažŠešo*。版权所有

如果我的英语不好，我很抱歉，我来自斯洛文尼亚。

首先将以下属性添加到“#menu li{}”

在“#menu li{}”之后添加此CSS

在您的情况下，菜单的HTML代码应该是

<ul>
    <li><a href="index.html" class="current_page_item" >Domov</a>
    <li><a href="Igre.html">Igre</a></li>
    <li><a href="robotika.html">Robotika</a></li>
    <li><a href="about.html">O meni</a></li>
    <li><a href="contact.html">Kontakt</a>
        <ul>
            <li><a href="">Web developers</a></li>
            <li><a href="">Suport</a></li>
       </ul>
    </li>
</ul>

请为此创建一个JSFIDLE。您可以访问bootstrap aur jquery网站，获取用于创建所需内容的示例代码，您可以进行自定义。我猜您想通过javascript（jquery）轻松实现。我还不知道任何javascript。。。难道没有一种方法可以用CSS和HTML来实现吗？你如何“做”一个网站？而且，它看起来工作得很好。

float:left;
position:relative;

#menu ul ul {
width:220px;
display:none;
position:absolute;
left:19px;
top:50px;
padding:0;

}

#menu ul li ul li {
    width:200px;
    padding:0 10px;
    height:30px;
    float:left;
    display:block;
    line-height:20px;
    line-height:30px;
    background-color:#6AA2FD;
}

#menu ul li ul li a {
    padding:0;  
}


#menu ul li:hover ul {
    display:block;
}

<ul>
    <li><a href="index.html" class="current_page_item" >Domov</a>
    <li><a href="Igre.html">Igre</a></li>
    <li><a href="robotika.html">Robotika</a></li>
    <li><a href="about.html">O meni</a></li>
    <li><a href="contact.html">Kontakt</a>
        <ul>
            <li><a href="">Web developers</a></li>
            <li><a href="">Suport</a></li>
       </ul>
    </li>
</ul>