html - 使用CSS使div与普通文本相同

Question

我想让我的网站响应式

当宽度小于1024px时，我需要在菜单中添加div menu-item。

当宽度超过1024px时我需要使用这个

<div id="menu" >
    HOME
    TOP40
    DJS
        <div id="br"></div>
    SHOUTBOX
    VERZOEKJES
</div>

而当宽度小于1024px时，我需要用这个

<div id="menu" >
    <div id="menu-item">HOME</div>
    <div id="menu-item">TOP40</div>
    <div id="menu-item">DJS</div>
        <div id="br"></div>
    <div id="menu-item">SHOUTBOX</div>
    <div id="menu-item">VERZOEKJES</div>
</div>

所以当屏幕的宽度超过1024px时，我想制作#menu-item与文本相同，我已经尝试过 float: left;但那是行不通的。

抱歉，我不知道你需要什么样的代码，所以现场演示在 random-radio.net

Answer 1

您需要阅读 CSS 媒体查询，这里有一篇好文章:http://css-tricks.com/css-media-queries/