The FullCalendar integrated into my website looks like this. It is not perfect, but it should be quite sufficient for multiple use cases.
The implementation of a calendar using FullCalendar, extended from one of the official examples, can be as simple as follows.
However, when I tried to integrate it into my website, I found that because the FullCalendar heavily relies on the external CSS for formatting and there are lots of CSS overridden from my website, both the entire webpage and the calendar got screwed up.
iframe tag for integration since the content from the
iframe will not be affected the CSS of the target.
The integration code looks as follows.
Because the responsive design of FullCalendar does not work well with small screens, I used fixed width and heigh and allowed overflow for the calendar.