引导程序中留有余量

时间:2018-12-11 20:48:30

标签: html css twitter-bootstrap

我可以在引导程序中添加类似于此 .ml-xl-5 的类,因为我想要的边距大于48px?


该怎么做?

1 个答案:

答案 0 :(得分:2)

只需在您自己的CSS样式表中添加一个自定义类,如下所示:

.ml-xl-6 { // change ml-xl-6 to whatever name or value you want
    margin: 64px; // change 64px to whatever value you want
}

并且您可以在要应用自定义边距的任何地方使用该类,就像使用默认的引导类一样:

<div class="ml-xl-6">
    <p>some text content here</p>
</div>

N.B。如评论中@bhmahler所述,我们需要了解和记住的重要一点是,在Bootstrap中,类名中的xl是指屏幕尺寸。如果您想复制引导程序的执行方式(例如,您也希望ml-sm-6ml-md-6也相应地调整大小),则需要为相应的屏幕尺寸添加媒体查询并添加ml-xl-6 ,css样式表中的ml-l-6ml-sm-6ml-xs-6等。