css - 如何为 Zurb Foundation 网格列添加边框？

Question

我刚刚尝试为我的基础网格列添加边框，但发现代码没有效果。已尝试寻找答案并实现替代技术，但由于某种原因没有任何效果。下面是我正在使用的代码(出于示例目的使用内联样式，实际代码中没有出现!)。

<div class="large-4 columns" style="border-color: #466d98; border-width:10px;">
<h2 class="subheader"> Lorem Ipsum </h1>
<img src="img/cloud.png">
<p> consectetur adipiscing elit. Suspendisse a venenatis quam, et sagittis quam. Aenean vehicula euismod ipsum, eget blandit libero auctor nec. Nulla eget purus ut nunc lacinia dignissim. Vestibulum feugiat porta cursus. Curabitur posuere mollis massa quis mollis. Suspendisse ac luctus est, nec vestibulum dolor. Suspendisse potenti. Vivamus egestas vestibulum ante egestas adipiscing. In hac habitasse platea dictumst. Etiam eros orci, bibendum ut ultricies quis, mollis ut dolor.</p>
</div>

我也尝试过这种方法(不是给列本身加边框，而是在它们里面添加带边框的 div):

<div class="large-4 columns">
<div style="border-color: #466d98; border-width:10px;">
<h2 class="subheader"> Lorem Ipsum </h1>
<img src="img/cloud.png">
<p> consectetur adipiscing elit. Suspendisse a venenatis quam, et sagittis quam. Aenean vehicula euismod ipsum, eget blandit libero auctor nec. Nulla eget purus ut nunc lacinia dignissim. Vestibulum feugiat porta cursus. Curabitur posuere mollis massa quis mollis. Suspendisse ac luctus est, nec vestibulum dolor. Suspendisse potenti. Vivamus egestas vestibulum ante egestas adipiscing. In hac habitasse platea dictumst. Etiam eros orci, bibendum ut ultricies quis, mollis ut dolor.</p>
</div>
</div>

这两种方法都不起作用。我很惊讶我在互联网上的任何地方都找不到解决方案，因为肯定有很多人想要带边框的列。希望这不是我忽略了一些简单得令人痛苦的事情的情况。任何人都可以阐明这一点吗？谢谢。

Answer 1

你可以试试:

<div class="large-4 columns" style="border: 10px solid #466d98;">

或在您的样式表中:

 .columns {
  border: 10px solid #466d98;
  }