サイトのデザインをちょっと更新したので使用したCSSを公開したいと思う。

しましまストライプを実装

.site-header
background: #009999;
    background-image: -webkit-gradient(linear,0 0,100% 100%, color-stop(.25,#ffffff), color-stop(.25,transparent), color-stop(.5,transparent), color-stop(.5,#ffffff), color-stop(.75,#ffffff), color-stop(.75,transparent),to(transparent));
    -webkit-background-size: 1000px;

上記コードのカラーコードfffを変更することでcolor変更が可能。

-webkit-background-size: 1000px;の値を変更することでしましまの大きさを調整できる。

要素を半透明にする

.main-body-in
background-color: rgba(255, 255, 255, 0.7);

また、背景が主張しすぎると読みにくいため、バックグラウンドに半透明の白紙を設置した。
0.7の値を弄ることで半透明度を変更できる。1.0が不透明。