ブログにグラデーションな背景画像の作り方
ブログの背景画像をグラデーションなふいんきにする場合、無料ツールを使用しながらグラデーション素材を作成し、その背景画像をスタイルシートへと組み込めば、簡単にブログカスタマイズができます。
グラデーション素材ＣＳＳの簡単作り方
ブログの背景をグラデーション加工するにはだいたい、こんな感じでやれば、手作り感のあるグラデーションブログ作りが可能になるのではないかなと思います。
グラデーション素材を作成する
ＣＳＳのBODYタグあたりに次の文字を追加する。
background-image: url(グラデーション素材ＵＲＬ);
background-repeat: repeat;
マージンとかの値を調整してグラデーションな背景画像をちらつかせれば、おしゃれな感じのブログにできあがるのではないかなって気がします。
このなかで、ＣＳＳへの組み込みは正直簡単だと思うんですが、やはり、グラデーション素材の作成いかんによってできばえもかなり違ってきたりしちゃうんです。
グラデーション素材の作り方としては、フリーソフトの R.G.B.Gradation Controller を使ってみました。
こんな感じであれこれして、ちょうどいい具合にグラデーションしてきたら、表示タグのビットマップウィンドウというところで別窓表示にすると、グラデーション素材が表示されます。
わたしはそのままキャプチャして、ペイント加工で９０度回転させて縦型素材にしちゃってますが、ファイルの保存のところでビットマップ画像として保存する方がいいのではないかなと思います。
こんなグラデーション素材が出来上がるので、ＣＳＳに組み込むといいと思います。このブログの背景画像に組み込んでみるとこんな感じになります。
body タグに組み込んだ場合は、前面の container の部分は背景を白く設定するといいと思います。
- 金ぴかブログの作り方
ブログの背景素材なんですけど、個別記事ページのヘッダー背景画像を金ぴかな感じにブログカスタマイズしてみました。オーラの泉の美輪さんがテレビで言ってたんですけど、色を金ぴかにしたら何ごとも事がうまく運ぶ... - 無料画像のブログで使い方
ブログの画像を作るには、やっぱデジカメで写真をとってアップロードするっていうのが一番かと思いますが、たいていの人は自分でとっても、逆光とかになってきたないブログ画像しかとれないと思うんです。そんな時に... - ＨＰグラデーション無料素材のブログ
以前にグラデーションな背景画像の作り方という記事を書いていたんですけど、最近、ホームページやブログの背景素材用のグラデーション素材サイトを作成してみました。同じようなブログのテンプレートでも、スタイル... - キャプチャー画像の作り方
初めてブログを作成する際、初心者さまにとってキャプチャー画像の作成を簡単にできると、とってもお役立ちなのではないかなと思います。 キャプチャー画像っていうのは、スクリーンショットとも呼ばれていますが... - ブログのアイコンバナーの作り方
ブログランキングや相互リンクなど、何かと必要になることが多いブログのアイコンバナーですが、今回はグーグル無料ツールの picasa を使用して、手作りバナーを作ってみました。結論からいうとアイコンバナ... - ブログロゴ作成の無料ツール
ブログのロゴやバナー画像を作成する無料ツールにもいろいろありますが、今回は GIMP という無料ツールを使って、初心者簡単にタイトルバナーを作ってみました。結論からいうと、できばえはこんな感じなんです...