日記小技
2003.6.30の日記より
日記の背景の編集及び画像のカラーの調べ方
日記を書くときのワタシのやり方の一つ・ご紹介しますぅ
日記に使う画像が決まるとレイアウト考えます もちろんメモ帳で編集です~メモ帳の使い方はこちら の画像を使って左下に一つだけ配置したい!! タグは background-image:url(http://~~~);background-repeat:no-repeat;background-position:bottom left をつかいますが・・・余白が・・↓ 出来れば画像と同じ色を使いたいですね。 画像に使っている色を調べる方法が ペイントで出来るんですよ ペイントの出し方は「スタート」→「プログラム」→「アクセサリー」→「ペイント」 色を調べたい画像をだします。 次にスポイトで画像の中で調べたいカラーの上でクリック 一瞬左のカラーが変わると思います。 ツールバーの(色)をクリックして「色の編集」→「色の作成」↓ クリックしたカラーが表示されたでしょうか~~~ 違った場所をクリックした時はやり直しね 赤枠で示してあるように(R)(G)(U)の脇に数値が書いてあります この数値をメモして下さいね この数値をHPで使うカラーコードに変換をします ペイントは閉じます。 今度は電卓を使いますよ・・・ 「スタート」→「プログラム」→「アクセサリー」→「電卓」↓ 表示→関数電卓にします そしてメモッた(R)の数値を電卓で入れます(10進) 右上に数字が入りましたら(16進)に円を入れます 二桁の数字が出ましたか↓~~~これも控えておきます (G)、(U)の数値を入れてそれぞれの16進の値を出します。。 R199はc7、G178はb2、U154は9a #c7b29a・・・並べるとこうなります これを背景のカラーに使います、タグは background-color:#c7b29a;で入れてみますと この様にキレイに背景の色が入りました(*^_^*) 最初は面倒な事もあると思いますがお試しくださいね この様にして画像に使っているカラーを枠に使ったり スクロールバーに使ったりしていますぅ~~ 参考タグです <CENTER style="width:500px;height:300px;border-style:double;border-color:#504139;border-width:8px;background-color:#ffffff;background-image:url(http://画像.gif);background-repeat:no-repeat;background-position:bottom left"> ここに文字を</center> 便利なソフトのお紹介 FE - Color Palette を使ってカラーの編集をしております ペイントでカラーの「RGB」を出して 電卓を使うのは一つの手段ですが 手っ取り早くこのソフトでカラーコード HTML形式(#FFFFFF)を出します
ジャンル別一覧
人気のクチコミテーマ
|