新規記事を追加した時に「NEW」の情報を斜め帯で表示する時に使用したtransform: rotate(315deg);周りの実装話です。

HTML

<div class="img"> 
	<time datetime="2015-09-18"> 
		<span class="hidden"> 09/18</span> 
		<span class="new"> NEW</span> 
	</time> 
</div>

※【Movable Type & jQuery】公開日が閲覧時より2週間前までの記事に「NEW」表示も参考にしてみてください。

CSS

.img {
    width: 216px;
    height: 146px;
    overflow: hidden;
    display: block;
    position: relative;
}
time {
    display: inline;
}
.new {
    width: 100px;
    padding: 3px 10px;
    background: #d43131;
    color: #fff;
    text-align: center;
    display: inline-block;
    position: absolute;
    top: 10px;
    left: -37px;
    text-transform: uppercase;
    transform: rotate(315deg);
}

配置に重要なのは入れ子のdisplay設定です。（※CSS赤文字）

要素を斜めに傾けているのは
transform: rotate(315deg);　の部分です。

参考：[CSS]画像やパネルに斜めにしたリボンを重ねるスタイルシート