填充日历方块的一半背景色


fill half bgcolor of calendar square

我已经学习了本教程:http://www.phpjabbers.com/how-to-make-a-php-calendar-php26-6.html#comments制作一个非常基本的日历。我的目标是创建一个非常基本的可用性日历,用不同的颜色填写预订的天数。我已经设法做到了这一点,但我希望能够通过只填充一半的正方形背景色来指示上午和下午,如以下所示:

http://www.phpjabbers.com/availability-calendar/

有人知道我是怎么做到的吗?

这更多地是在html/css的领域中,而不是php。实现您想要的功能的一种方法是简单地指定css类,这些类根据日历日期各自的预订状态来设置日历日期的样式。

我礼貌地拒绝查看您提供的教程,所以我假设您使用表<td>单元格来显示日历天数。实现目标的一种方法是创建两个图像,并将它们用作具有匹配类别的细胞的背景:

<style>
td.booked_morning { background-image: url(lower_half.png); }
td.booked_afternoon { background-image: url(upper_half.png); }
td.booked_full { background-color: yellow; }
</style>

如果您使用<div>元素来保存日历天数,则同样的概念也适用。您只需使用PHP为每个日历单元格标记适当的样式。

现在有一种方法可以用传统CSS半填充对象。您可以使用CSS3绘制一个彩色三角形,或者在div中粘贴一个图像

就我个人而言,我会改用背景图像。

使用图像作为背景。例如red.gif,green.gif,red-green.gif。为表中的每个单元格设置默认背景(例如red.gif),然后创建两个css类(.fhalf,.full),它们将具有的背景属性!重要。现在,您只需将class.half或.full添加到任何单元格中,它将是半彩色或全彩色