Question

我正在让我的网站对设备做出响应，但我想知道我是否可以为iphone设置网格或边距/填充属性，这样我就可以很好地放置它而不是彼此有两个段落。

我已经尝试对某些文本进行网格化，但它仍然看起来很奇怪这是我的代码：

            <div class="row">
                    <div class="col-xs-1 col-lg-12">
                <a href="#" class="test navbar-brand">Thisismy Test</a>
                    </div>
                </div>

Answer 1

您没有将此标记为Bootstrap网格，但我认为这是因为您的网格类。

你提到你要阻止导航栏品牌文字包装在iPhone上，所以我想知道你是否有理由不让导航栏品牌的父母更广泛？

我认为它需要最小化if (1>2) then return 22 else return 43

这是一个显示现有HTML和修改的示例 https://codepen.io/panchroma/pen/OgQxBw

HTML

col-xs-5

Answer 2

如果要在移动设备的整行中显示段落，请使用col-xs-12类，它将占据整个行空间，并在所有屏幕尺寸中显示所有内容。

<div class="row">
  <div class="col-xs-12">
    <a href="#" class="test navbar-brand">Thisismy Test</a>
  </div>
</div>

如果要并排显示2个段落，请为每个div使用col-xs-6

<div class="row">
  <div class="col-xs-6 col-lg-12">
    <a href="#" class="test navbar-brand">Thisismy Test</a>
  </div>
<div class="col-xs-6 col-lg-12">
    <a href="#" class="test navbar-brand">Thisismy Test</a>
  </div>
</div>

如果您想编写自己的CSS，可以使用媒体查询为不同的屏幕尺寸定义自定义CSS https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries

如何设置设备的边距/填充

2 个答案: