I am having issues setting the calendar font sizes to be smaller.
I have changed setting a container div font size, no effect.
I have also changed the fullCalender.css font from 1em to 0.5em and to a px size but the calendar text stays the same.
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):
问题:
回答1:
This is quite the blast from the past, but I originally found this looking for a solution.
I just wanted to change the font size of the elements in the table (date headers, time sidebar). The following worked for me:
th.ui-widget-header {
font-size: 9pt;
font-family: Verdana, Arial, Sans-Serif;
}
I used opera dragonfly to find the element class (CTRL+SHIFT+i -> Hover over element), but any DOM inspector should do.
回答2:
Add the 'theme' setting in FullCalendar.
$('#calendar').fullCalendar({ theme: true });Add your Custom themed CSS by editing the FullCalendar provided CSS file, http://arshaw.com/js/fullcalendar-1.6.1/demos/cupertino/theme.css
Note: Demo is here http://arshaw.com/js/fullcalendar-1.6.1/demos/theme.html
回答3:
For future reference:
.fc-title{
font-size: .9em;
}
回答4:
try and use !important which is a CSS rule to obey that rule and ignore others.
e.g: in CSS:
.calendar{font-size: 12px !important:}
in jQuery:
$('.calendar').css('font-size','12px !important');
回答5:
Change general font size (fullcalendar.css) except Modals , addevent and edit event
body .fc {
font-size: 1.5em; <--- change here for general
}
回答6:
I could solve that problem with the following
::ng-deep body .fc {
font-size: 12px;回答7:
I have found the cause, not sure why this is causing the issue but when I didn't declare the document type as
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
it wouldn't change the font size.
Thanks
