How to change the font-color of jQuery Full-calendar header title?

问题

I'm using the jQuery full-calender for my work. As in the image I have created the calendar but now I want to change the title color of the header (February 2015) to green. (to match it to the theme)

So far I couldn't do that. I saw some SO questions and answers which are suggesting to change the .css file. But then the change will affect to all calendars (I'm having several calendars with several themes)

How can I solve this problem ?

UPDATE :

This is an example code in a fiddle.

回答1:

Here is the solutions for this one is

CSS

div#fullcalendar .fc-header-title h2 {
    color: #0F0;
}

Demo

which will does the work.

as per your fiddle example

and every Calender ID will be unique, so you can add

div#CalenderName .fc-header-title h2 {
    color: #0F0; //change calender title Color accordingly
}

for example calender1 is your calender id then in CSS

div#calender1 .fc-header-title h2 {
    color: #0F0; //change calender title Color accordingly
}

and for example calender2 is your calender id then in CSS

div#calender2 .fc-header-title h2 {
    color: #0F0; //change calender title Color accordingly
}

回答2:

Create a custom class that overrides the font color, then add it to only the specific calendar you want to override.

It'll look something like this (since you didn't provide any code).

style.css

.override-font-color {
    font-color: #fff;
}

index.html

<div class="calendar-theme-header override-font-color">February 2015</div>

来源：https://stackoverflow.com/questions/28387659/how-to-change-the-font-color-of-jquery-full-calendar-header-title

标签

jquery

html

css

fullcalendar