試行錯誤

というか、それ以前の問題ですな。

いや、スキンのカスタマイズができるようになったのでチャレンジしているんだけど、ＣＳＳなんぞまったく未知の領域だったので苦戦中。

画像はこれをこんな風に切り出して、とかやるのは楽しいんだけど、タイトル文字がうまく動かせないのでバランスが変。ｐｉｔｔｓさんからアドバイを頂いたんで少し前進したけど、しばらく悩んでみるつもり。

 

そんなことより記事を書けよと、自分で突っ込んでたりして。

どっちにしても寝不足が続くなぁ。

コメント 6

ほー、そんな機能が追加されたんですね。
暇なとき、私も試してみます。
by momongaz (2007-01-26 05:16) 

ふふふ。楽しいですよね♪
自分とこのコメントに文字のずらし方を書いてみました(^^)/
by pitts (2007-01-26 09:45) 

ふふふ。楽しいですよね（第２弾）♪
知ってると、便利かもしれない、ウンチクをひとつ。

paddingとmarginが時折出てきますが、こやつの設定でいかようにも。
とある範囲（文字列でも、画像でも）があったとします。
範囲のマワリは枠線で囲まれているとします（あくまでも仮定。脳内変換でお願いいたします）。
枠線の内側、文字や画像までの距離がpadding（枠内余白）、枠線の外側余白をmarginといいます。

よく、padding: 0 10px 5px 0;　なぞと記述されていますが、この数値が余白の長さになります。左から【上、右、下、左】です。

なので。ワタクシの場合、タイトルを左の下に落としているので、以下のような記述になっています。↓
#banner h1{
font-size: large;
font-weight: bold;
padding: 200px 0px 8px 15px;　　　←ここでごじゃる。
margin:0;
}

タイトル下に入る紹介文は、次の通りになっておりまするー。
上の余白がゼロですけれど、これはタイトルの下余白が8pxあるので、ちゃんと空きますよん。

#lead{
margin:0;
font-size: x-small;
color: #FFFFFF;
padding: 0px 0px 5px 10px;
}

ほかにもいろいろとお楽しみが♪
ページのソースを見て、cssのどの部分が対応しているのか確認しつつ、いろいろいじってみると楽しいかと～。
素敵な写真が入るのですわよねッ、と首を長くして待っております♪
by 柊なお (2007-01-26 19:01) 

　私もちょっと変えました。細かい約束事をいちいち調べる時間も気力も無し！で、勘のみを頼りの独断流。タイトルの配置など、手際の良い方法があるはず！と思いつつ。。。現在の課題は Mac と Win のエクスプローラーのバージョン違いによる「見え方」の違い。これはなんとかせな・・・
　＊このコメントの前の「柊なおさん」のチップスなど、とても参考になります。

　でも、いずれはもっと簡単になるんでしょうね〜
by e-g-g (2007-01-26 19:16) 

★ momongazさん
そうなんですよ。
ただ私の場合、この手の知識がまったくないので
ちょっとくらいの暇では済みそうになかったりして。

★ｐｉｔｔｓさん
重ね重ねお世話さまでした。
あちこちぶつかりまくりながらも、一応格好が付きました。
なんかお礼しなきゃね。
フローリングの張り方なんてどう？鴨居の入れ方とか♪

★柊なおさん
すごく参考になりました。
たぶんmarginがスペースみたいな役目をするんだろうなと思ったんですけど、paddingの方なんですね。
ｐｉｔｔｓさんとなおさんからコメント頂かなかったら、投げ出してたと思います。ほんとにありがとうございました。

今回は素敵な写真でもないですが、これからも精進していきたいと思います。

★ＥＧＵＣＨＩさん
勘のみであそこまでとは、さすがデザインのプロ、ですね。
私は見て触れる物でないと、さっぱりです（苦笑）

せめてプレビューしながらできるようになると、少しははかどるんですけどね～。
by YASH (2007-01-27 22:14) 

こんばんは
いやいや、タイトルまわりのイメージ、いいじゃないですか。しみじみとしていて。
プレビューですけど、ウィンドウを二つ開いて、片方でオペレーション、もう片方でオペレーションのたびに更新して確認してます〜。
by e-g-g (2007-01-27 23:55)