使用bootstrap网格时,使段落看起来更好

时间:2012-10-31 18:04:26

标签: css twitter-bootstrap position

你好我正在使用bootstrap网格并试图做到这一点:

image http://gyazo.com/8bf865ea19bb09408e7dd214f1887d24.png

这就是我用来尝试这样的东西:

顺便说一下,代码在bootstrap容器中,

<div class="headers">

    <li class="span3">
    <div id="icon-1"></div>
    <span class="head">Experienced</span>
    <p class="paragraph">Brought to you by a well-knowledged developer and designer, that are ready to serve. We deliver one Hell of a product so strap yourself down to your chair and get ready.</p>
    </li>
    <li class="span3">
    <div id="icon-2"></div>
    <span class="headweb">Web Development</span>
    </li>
    <li class="span3">
    <div id="icon-3"></div>
    <span class="head">UI/UX Design</span>
    </li>
</div>

结果就是这样:

image2 http://gyazo.com/351f69ce5b85c9b66a38de96c393750e.png

正如您所看到的段落看起来与第一段中的不同,那是因为引导网格跨度类别数太短,但如果我将使用跨度4,则图标将陷入底部。

如何让段落看起来像第一张图片中的样子? 这是什么问题?感谢。

1 个答案:

答案 0 :(得分:0)

您的文字看起来比原始文件大,但这太简单了。尝试创建一个新类,.span3wide并在样式表中增加大小,减少填充/边距。另外,添加保证金:0 auto;到#icon-1到中心。