/*! * Sidebar */ .sidebar float left width 330px margin-left -350px padding-top 20px padding-bottom 20px .widget position relative margin-bottom 20px clear both .widget ul margin 0 padding 0 .widget-hd, .widget-date margin 0 padding 0 border-bottom 2px solid c-eee strong position relative display inline-block bottom -2px color #444 border-bottom 2px solid #ff5e52 font-weight normal .logout position relative bottom -2px font-size 14px font-weight normal text-decoration underline &:hover text-decoration none .widget-date text-align center border-bottom none strong border-bottom none .widget-bd, .archive-list margin 0 padding 0 list-style none li display block padding 10px 0 line-height 1.5 border-bottom 1px solid c-eee font-size 14px overflow hidden text-overflow ellipsis white-space nowrap .badge, .archive-list-count &::before content "(" &::after content ")" color #a4a4a4 padding .2em .5em a .avatar float left width 36px height 36px margin-right 10px border-radius 50% transform rotate(0) transition .5s a:hover .avatar transform rotate(360deg) opacity .85 p margin 0 padding 0 .tags-cloud > a margin 0 3px position relative &::after content '' display block // 开始时候下划线的宽度为100% width 100% height 2px position absolute bottom -3px left: 0 background #aaa transition all 0.3s ease-in-out // 通过transform的缩放scale来让初始时x轴为0 transform scale3d(0,1,1) // 将坐标原点移到元素的中间,以原点为中心进行缩放 transform-origin 50% 0 text-decoration underline &:hover::after transform: scale3d(1,1,1);