我在使用一个网站时遇到问题。 这是网站here .顶部导航栏在手机/平板电脑 View 中不正常。只在桌面上没问题。移动端查看图片:
我不想让它响应,但在手机或平板电脑上它应该与滚动相同的布局。导航代码没有问题。问题是关于持有导航的 div。 因为如果我删除导航并只使用文本,它会遇到同样的问题:
div的HTML代码:
<div class="outer top">
<div class="inner">
<div class="nav">
<ul>
<li>....</li>
<li>....</li>
<li>....</li>
</ul>
</div>
</div>
</div>
CSS代码:
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
border: 0 none;
font-size: 100%;
margin: 0;
padding: 0;
vertical-align: baseline;
}
body {
background: url(../images/bg.png) repeat-x #fff;
color: #fff;
font-family: Helvetica, Myriad Pro, Verdana;
font-size: 14px;
line-height: 1em;
}
.outer {
width: 100%;
float: right;
display: block;
}
.top {
background: #004481;
}
.inner {
width: 940px;
margin: 0 auto;
}
我使用了 100% 的宽度。但是,在手机/平板电脑上仍然不行。你能给我一个解决方案吗...
最佳答案
我将您的代码放在 jsbin 中,但无法看到您所看到的内容。你能添加更多代码吗?
关于css - 如何为移动设备制作相同的网站布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15362958/