0
点赞
收藏
分享

微信扫一扫

原来博客园的日历是这样用的!

沈芏 2022-06-27 阅读 125


原来博客园的日历是这样用的!_css 一直以来,总觉得日历看起来又丑又不好用。然鹅,就在昨天,当我突然想美化一下日历时,才发现原来他还有这样的用途!

美化前

普普通通的就是一些数字,好像没有啥用,连今天是哪一天都看不出来,还有数字下面的下划线又是什么意思?(好像是我开启了禁用css导致的....)

通过对源码的查看和研究后,我明白了!

原来啊!下划线表示那一天你发过随笔动态,而且今天的日期也是有区别于其他日子的 ​​class​​,稍加美化应该就可以变得很好看!

美化后

原来博客园的日历是这样用的!_css_02

有没有好看很多呢?

这样看起来更符合日历的功能:

  • 红色的数字代表那天你发过随笔
  • 红色的圆圈数字代表今天的日期

美化的 CSS代码

/*******日历*************/

.CalTitle{
font-size: 18px;
font-weight: 600;
line-height: 40px;
}

.CalDayHeader{
font-size: 16px;
line-height: 40px;
border-bottom: 1px solid #F4F4F4;
}

.CalWeekendDay{
font-size:16px;
line-height:2.1;
}

.CalTodayDay{
background-color: #b62525;
color:#fff;
border-radius:50%;
}

#blog-calendar u{
color:#b62525;
font-weight:600;
text-decoration:none!important;
}

未经作者授权,禁止转载 THE END

举报

相关推荐

0 条评论