Question

嗨所以我正在创建一个网站，但我对页脚菜单有点困扰 - 当我使用float：left时它只会变为水平（但是在穿过某个点之后它会创建一个新行）。如果我使用除浮动之外的任何东西：左边它变成垂直的。我的目标是让所有这一切都在一条线上。图像中的示例（我的目标是使页脚菜单像我的顶级菜单一样水平）https://i.gyazo.com/61f2f5f7c0e6d98ad181364365163dd4.png

这是我使用的代码。基于菜单代码的页脚代码：

#menuPan{width:736px; height:36px; position:relative}

#menuPan ul.menu{position:absolute; top:0; left:0; width:736px; overflow: hidden; background-color:#3f3f3f;}
#menuPan ul.menu li{height:36px; margin-right:5px; float:left; font-size:large; }
#menuPan ul.menu li a{height:36px; display:block; display: inline-block; color: white; text-align: center; padding: 8px 10px; text-decoration: none;}
#menuPan ul.menu li a:hover{height:36px; background-color: #6d6d6d;}

我的页脚代码：

#footer ul.footertest li{height:20px; float:left; font-size:large;}
#footer ul.footertest li a{height:20px; display:block; display: inline-block;  color:darkslategrey; text-align: center; padding: 8px 10px; text-decoration: none;}
#footer ul.footertest li a:hover{height:20px; background-color: #6d6d6d;}

Answer 1

尝试申请

var that = this;
this.image.onload = function () {
    console.log("image was loaded " + that.bounds);
}

css / HTML中的水平菜单

1 个答案: