MovableType 5.0 テーマ 1070・1071のサイドバーにはCSS3のRGBa

MovableType 5.0 テーマ 10701071のサイドバーにはCSS3のRGBaプロパティとborder-radiusプロパティを使用しています。

div#sub dl dt {
    font-size: 100%;
    font-weight: bold;
    color: #333333;
    background-color: rgba(255,255,255,0.5);
    padding: 15px 20px 15px 15px;
    border-radius: 10px 0px 0px 10px;
    -moz-border-radius: 10px 0px 0px 10px;
    -webkit-border-radius: 10px 0px 0px 10px;
}
/* IE8 and below */
div#sub dl dt {
    background-color: #f6f6f6\9;
    padding: 15px 20px 15px 15px\9;
}

概要

  • 白を50%透過の背景色、左上下10pxの角丸
  • -moz-border-radiusはFirefox 3.6以下用。※Firefox 4ではborder-radiusのプレフィックス(-moz-)は不要
  • ハックによりIE8以下では#f6f6f6の背景色
Posted