我正在尝试学习响应式网格,但很难掌握如何将元素放置在“列”中。我正在使用其中的 12 个,看起来像这里的那个:http://www.w3schools.com/css/css_rwd_mediaqueries.asp
例如,我想要一行,左侧是网站名称,右侧是导航栏:
<div class="row">
<div class="col-1">empty column acting as margin; do i need a div for this?</div>
<div class="col-2" id="name">
website name
</div>
<div class="col-4">another set of empty columns</div>
<div class="col-4" id="navbar">
<a href="home.html">Home</a>
<a href="about.html">About</a>
<a href="page3.html">Page 3</a>
</div>
<div class="col-1">empty column as margin</div>
</div>
我怎样才能做到这一点?其中带有“空列”的 div 显然是错误的,但我不确定如何获得正确的宽度。上面的链接说每行的列数加起来应该是12;这是否意味着我也需要指定空列?
最佳答案
主流浏览器会忽略空 div 的宽度,避免这种行为的一种简单方法是向空 div 添加宽度。
<div> </div>
关于html - 响应网格中的空列?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35283053/