在引导程序中填充

关注

发信

关注(28)粉丝(399)

在引导程序中填充

本文介绍了在引导程序中填充的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在使用引导程序:


<div class="row"><div class="span6"><h2>欢迎</h2><p>您好，欢迎访问我的网站.</p>
<div class="span6">图像在这里(待办事项)

Main 也有灰色背景.页面背景为白色.我遇到的问题是文本正好位于灰色背景的边缘.我想要一些填充，但是当我添加它时，图像跨度会转到下一行.

有什么想法我哪里出错了吗?

解决方案

我没有使用过 Bootstrap，但我在 Zurb Foundation 工作过.我过去常常像这样添加空间.


<div class="row"><div class="span5 offset1"><h2>欢迎</h2><p>您好，欢迎访问我的网站.</p>
<div class="span6">图像在这里(待办事项)

访问此链接:http://getbootstrap.com/2.3.2/scaffolding.html 并阅读部分:偏移列.

我想我知道你做错了什么.如果您像这样对 span6 应用填充:


<h2>欢迎</h2><p>您好，欢迎访问我的网站.</p>

这是错误的.你要做的就是给里面的元素添加padding:


<h2 style="padding-left:5px;">欢迎</h2><p style="padding-left:5px;">您好，欢迎来到我的网站.</p>

Im using bootstrap:

<div id="main" class="container" role="main">
<div class="row">
    <div class="span6">
        <h2>Welcome</h2>
        <p>Hello and welcome to my website.</p>
    </div>
    <div class="span6">
        Image Here (TODO)
    </div>
</div>

Main also has a grey background. The background of the page is white. The problem I am having is that the text is right to the edge of the grey background. I want some padding but when I add it in, the image span goes to the next line.

Any ideas where I'm going wrong?

解决方案

I have not used Bootstrap but I worked on Zurb Foundation. On that I used to add space like this.

<div id="main" class="container" role="main">
    <div class="row">

        <div class="span5 offset1">
            <h2>Welcome</h2>
            <p>Hello and welcome to my website.</p>
        </div>
        <div class="span6">
            Image Here (TODO)
        </div>
    </div>

Visit this link: http://getbootstrap.com/2.3.2/scaffolding.html and read the section: Offsetting columns.

I think I know what you are doing wrong. If you are applying padding to the span6 like this:

<div class="span6" style="padding-left:5px;">
    <h2>Welcome</h2>
    <p>Hello and welcome to my website.</p>
</div>

It is wrong. What you have to do is add padding to the elements inside:

<div class="span6">
    <h2 style="padding-left:5px;">Welcome</h2>
    <p  style="padding-left:5px;">Hello and welcome to my website.</p>
</div>

这篇关于在引导程序中填充的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

08-15 04:58