バックグラウンドモノグラムの作り方 web背景

まず基本
パターン作成
サイズは240 240くらいの6角形縦 画像1個

その場合
 h240 w360の四角でパターンがとれる。

ヤサカは背景グレーで ロゴ白 ストライプ白
ボディーにストライプと背景色

コンテンツバッグにロゴ センター トップにて
イラレで書き出す際
2つのロゴに真ん中でとると
背景がちょうど真ん中になるよ。

これが新しくみつけたブラッシュアップ

それとストライプの大きさが
3_3のやつを使ったから

4_4_のやつと共に原型をおいときます。
斜めストライプ背景用少し大きめ

サイト

http://www.stripegenerator.com/#Zm9yZT1GRkZGRkY7aD0zMDt3PTM7cD0zO2JhY2sxPTAwMDAwMDtiYWNrMj1mZjAwMDA7Z3Q9MDtkPTA7c2hhZG93PTA7

ちなみに
メインコンテンツのサイドにボーダーを入れて
普段はパディングを広くみせ
幅が狭まると
ボーダーが消えるcssも

#d_contents_width {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	border-right-width: 25px;
	border-left-width: 25px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #FFF;
	border-left-color: #FFF;
}

@media screen and (max-width: 1050px){
	
#d_contents_width {
	border-right-width: 0px;
	border-left-width: 0px;	
	}	
	
}