如何用CSS制作横向菜单

html-css014

如何用CSS制作横向菜单,第1张

如果是导航菜单可以使用ul无需列表来制作

同时使用CSS中的float:left来控制li靠左浮动即可实现横向菜单

注意UL或UL的父级容器宽度必须大于所有li宽度的和

例如

<style>

ul {

padding:0

margin:0

list-style:none

width:600px

height:50px

line-height:50px

text-align:center

}

ul li {

width:100px

height:50px

float:left

}

<style>

<ul>

<li>菜单项目1</li>

<li>菜单项目2</li>

<li>菜单项目3</li>

<li>菜单项目4</li>

<li>菜单项目5</li>

<li>菜单项目6</li>

<ul>

CSS即层叠样式表是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS控制表格横向显示Html代码: <div style="position:relative"><table class="t1"><tr><td>1</td></tr></table><table class="t2"><tr><td>2</td></tr></table><table class="t3"><tr><td>3</td></tr></table></div>CSS代码:<style type="text/css">.t1, .t2, .t3 {width:100pxposition:absolute}.t2 {top:0left:100px}.t3 {top:0left:200px}</style>