Question

看起来，引导程序在寻呼机的顶部和底部放置了10px的余量，我希望将其降低到2px，并使寻呼机的高度稍微小一些。我正在使用xsnippets.openNTF中的代码，如下所示：

<xp:pager partialRefresh="true" id="pager1" for="repeat1"
    panelPosition="left" styleClass="bootstrapPager">
    <xp:pagerControl type="Previous" id="pagerControl1"
        styleClass="bootstrapPagerPrevious">
    <xp:this.value><![CDATA[«]]></xp:this.value>
    </xp:pagerControl>
    <xp:pagerControl type="Group" id="pagerControl2"
            styleClass="bootstrapPagerMiddle">
    </xp:pagerControl>
    <xp:pagerControl type="Next" id="pagerControl3"
        styleClass="bootstrapPagerNext">
        <xp:this.value><![CDATA[»]]></xp:this.value>
    </xp:pagerControl>
</xp:pager>

建议我创建一个新的css并将xs从xsnippets复制到它并将其应用到页面但是我不认为使用内置的bootstrap是必要的，所以我删除了css。寻呼机的工作方式相同。所以我想覆盖bootstrapPager类并更改边距。我创建了一个名为myBootstrap.css的新css并添加了这个块

.bootstrapPager {
  display: inline-block;
  padding-left: 0;
  border-radius: 4px;
  margin-left: 10px;
  margin-bottom: 2px;
  margin-top: 2px;
  line-height: 1.42857;
}

并将顶部和底部边距更改为2px。添加了css作为资源，但寻呼机边距似乎没有改变。也许还有一些其他设置需要改变。当我读到它时，这个类应该覆盖主bootstrap.css。

EDIT 如果我将禁用主题设置为true然后它似乎删除边距，但它也删除所有其他样式，这也是不好的。这是寻呼机的样子（没有连接到重复但不应该重要。主要问题是它消耗的垂直空间量。当我在Chrome中检查元素时，它看起来非常像是获取值来自主要的bootstrap css。

Answer 1

比尔，

不确定这是否有效，但请尝试将!important添加到CSS选择器。这在过去对我有用。在我的情况下，它是OneUI，但概念是相同的。这假定正在应用样式，但会被覆盖。

.bootstrapPager {
  display: inline-block;
  padding-left: 0;
  border-radius: 4px;
  margin-left: 10px;
  margin-bottom: 2px !important;
  margin-top: 2px !important;
  line-height: 1.42857;
}

欲了解更多信息，去年我遇到类似问题的时候写了一篇关于这个主题的博客文章：http://notesspeak.blogspot.com/2014/10/quick-tip-forcing-css-override.html

注意：我从未尝试过“禁用主题”功能。

如何覆盖寻呼机默认的上下边距

1 个答案: