使用CSS更改Twitter Bootstrap中的按钮背景颜色

时间:2022-11-20 15:21:21

I am using the following pagination button styles provided by Twitter Bootstrap:

我正在使用Twitter Bootstrap提供的以下分页按钮样式:

<ul class="pager">
  <li class="previous"><a href="#">&larr; Older</a></li>
  <li class="next"><a href="#">Newer &rarr;</a></li>
</ul>

This is how they currently look like:

这是他们现在的样子:

使用CSS更改Twitter Bootstrap中的按钮背景颜色

How do I need to change my CSS style to change the background color of these buttons from green to some other color?

如何更改CSS样式以将这些按钮的背景颜色从绿色改为其他颜色?

I tried this CSS code, but it did not change the button styles:

我尝试了这个CSS代码,但是它没有改变按钮样式:

.next {
    background-color: #ecf0f1;
    color: #2d525d;
}

Thank you!

谢谢你!

3 个解决方案

#1


5  

You need to overwrite the css codes:

您需要覆盖css代码:

.next a {
    background-color: #ecf0f1 !important;
    color: #2d525d !important;
}

Edit: The color and background-color styles are for "a" element inside the li.

编辑:颜色和背景颜色的风格是为“a”元素在里。

#2


1  

you can also add !important to your custom css

您也可以添加!重要的自定义css

.next {
background-color: #ecf0f1 !important;
color: #2d525d;
}

#3


1  

Use

使用

!important

after you css but before ;

在css之后但在css之前;

It pretty much means ignore anything else and use THIS !important

它几乎意味着忽略其他任何东西,并使用这个!很重要

you will need to use this to break out of default styling in some frameworks, its also useful for media queries.

您将需要使用它来打破某些框架中的默认样式,它对于媒体查询也很有用。

#1


5  

You need to overwrite the css codes:

您需要覆盖css代码:

.next a {
    background-color: #ecf0f1 !important;
    color: #2d525d !important;
}

Edit: The color and background-color styles are for "a" element inside the li.

编辑:颜色和背景颜色的风格是为“a”元素在里。

#2


1  

you can also add !important to your custom css

您也可以添加!重要的自定义css

.next {
background-color: #ecf0f1 !important;
color: #2d525d;
}

#3


1  

Use

使用

!important

after you css but before ;

在css之后但在css之前;

It pretty much means ignore anything else and use THIS !important

它几乎意味着忽略其他任何东西,并使用这个!很重要

you will need to use this to break out of default styling in some frameworks, its also useful for media queries.

您将需要使用它来打破某些框架中的默认样式,它对于媒体查询也很有用。