2013/06/28

CSS3

 そんなこんなでブログの見た目というのか、テンプレートを換えたわけですが。そのついでに、CSSもすこしいじってみました。

 CSSというのは、何ちゅうか。ウェブページを一つの「舞台」と喩えると、HTMLが「脚本」で、CSSが「演出」みたいなものになります。HTMLで書かれてたり指示される内容を、実際にどう見せるのか、その体裁やデザインを受け持つものです。

 具体的には、ブログのタイトルを目立つようにしてみました。
 こんな感じ。

 テンプレートを換えるとブログのタイトルがとっても見にくくなってしまったんですね。背景に埋もれてしまい、タイトル文字を大きくしたり、色を変えたりしても目立たない。
 こんな感じ。埋もれてるので反転させてます。

 そこで、タイトル部分の背景色をすこしいじってみたり。
 背景色を透明度を持たせた白色にして、背景の画像、サイコロ柄を見せるようにしながら、タイトルも見せるようにしてみました。
 しかしそれでも、まだ弱く。
 文字に影をつける「text-shadow」というのを応用して、タイトルを袋文字に。
 全方向に厚みを持たせながら、濃い影をつけていくと……スポーツ新聞の見出しとかテレビ番組のテロップなんかでおなじみの、あの縁取りされた文字のようになるわけです。

 いろいろと試行錯誤しながら、現在の形にしてみました。
 透明度を持たせた色が使えたり、文字に影をつけたり……ていうのは、昔はできなかったんですよ。僕が勉強した頃はCSS「2」で、今はCSS「3」にレベルアップしてて。
 僕のあずかり知らぬ所で、ウェブをより良くしようとする知らない組織の人達が、いろいろと仕様を変えていまして。こういうのは要らないだろ、と廃止したり。こういうの欲しいんでしょ、と追加したり。それにブラウザが対応して。ウェブページ作る人も対応して。そんな流れです。

 昔なら他で画像を作っておいて、それを貼り付けて……ということをしていたのですが、今はCSSでやれてしまうんですね。数年前からそうなってたみたい。
 CSS3もちょっと勉強しておきたいなと思いました。


 追伸
 お素麺を海へと還してやりましたよ、岸和田で。大きくなって、還ってこい!

0 件のコメント :