How to set the current day color in FullCalendar?

问题

I would like to change the color of the current day but only when the calendar is in the day agenda view. My users say they're having a hard time seeing the lines or something. I looked through the documentation as well as the css/js and didn't find a quick way of doing it. Is this even possible without major code changes?

回答1:

I honestly don't really know what you're talking about, but the jQuery UI fullcalendar widget uses the CSS class .fc-today to style the current day. If your changes aren't visible, try to use !important — it might be that one of the many other classes overrides your styles elsewhere.

回答2:

you can use following code

.fc-today {
    background: #FFF !important;
    border: none !important;
    border-top: 1px solid #ddd !important;
    font-weight: bold;
}

回答3:

If you aren't using a theme, this worked for me using FullCalendar 2.3.1

.fc-unthemed .fc-today {
  background: ....;
}

回答4:

I had multiple calendars so this worked:

#calendar .fc-today {
    background: #FFF !important;
}

#calendar-two .fc-today {
    background: #FFF !important;
}

Using #calendar-favorite .fc-unthemed .fc-today { ... } did not work, so remember to remove the .fc-unthemed part.

Also check out the jquery way: https://stackoverflow.com/a/17930817/1066234 using dayRender

回答5:

To change color/background of fullcalendar's current day in dayview, add the following CSS class and make sure it is loaded after all css styles.

  .fc-view-basicDay .fc-today {
     color:....;
     background:....;
  }

回答6:

for me it was .ui-state-highlight.fc-today

回答7:

This work for me in FullCalendar 3.6.1

#calendar-id .fc-widget-content:not(.fc-axis) {
       background: #FFF !important;
}

来源：https://stackoverflow.com/questions/4769707/how-to-set-the-current-day-color-in-fullcalendar

标签

javascript

jquery

css

fullcalendar