菜单格式化HTML

我正在尝试为我的网站创建一个菜单栏。这就是我所在的地方。 enter image description here 菜单格式化HTML

我想让快速搜索文本框移动到菜单栏的右侧。这是我的菜单栏的代码。

<div id="menu"> 

    <ul> 
    <li><a href="default.php">Home</a></li> 
    <li><a href="search.php">Quote</a></li> 
    <li><a href="history.php">History</a></li> 
    <li><a href="lookup.php">Lookup</a></li> 
    <li><form id="quickquote" method="get"> <input type="text" size="15" name="symbol" /> 
     <input type="submit" value="Quote" onClick="quickquote.action='search_get.php';"/> </form> </li> 

    </ul> 
    </div>

我也想知道为什么在我的菜单栏上方有一个白色条纹，即使我将边距设置为0px。这是我的样式表。

ul 
{ 
position:relative; 
list-style-type:none; 
background-color:#31A8FF; 
overflow:hidden; 
margin:0px; 
} 

li 
{ 
float:left; 
font-size:12pt; 
text-align:center; 
margin:5px; 
}

如何摆脱菜单栏上方的白色条纹，以及如何将快速搜索框移到右侧？由于

来源

2014-06-09 Nguyen Tran

它已经在右边.... – APAD1

给所有的一切''li'浮动：除了最后一个孩子left' :)给'浮动：right'持续一个:) –

更好的标记是晶块从菜单中插入新的DIV。

但对于这个标记：

ul#menu{ 
margin: 0; 
padding: 0; 
} 
ul#menu li{ 
margin: 0; 
padding: 0; 
float: left; /*LTR*/ 
list-style: none; 
} 
ul#menu li:last-child{ 
margin: left: 30px; /*LTR -- Your margin*/ 
} 
input[type="text"]{ 
float: left; /*LTR*/ 
} 
input[type="submit"]{ 
float: right; /*LTR*/ 
margin-right: 10px; /*LTR*/ 
}

来源

2014-06-09 17:55:29

移动到右：

#quickquote { 
float: right; 
}

除去白色条纹：

body { 
margin: 0; 
padding: 0; 
}

来源

2014-06-09 17:28:42 almo

添加下面的附加风格 -

ul{float:left;width:100%} 
ul li:last-child{float:right;}

来源

2014-06-09 17:34:42

菜单格式化HTML

回答

相关问题