Home / Diary / タグ: css

123

目次

  1. 枠付きグラデで四角い角を丸くする - Nifty++
  2. JavaScriptで枠付き丸角をつける
  3. CSSによる段組を非推奨してみる

枠付きグラデで四角い角を丸くする - Nifty++

丸角を作って1ドットの枠線だけじゃ物足りないということで改良した。

Nifty++ サンプル

サンプルページ下部の橙色のところにマウス乗せてホイール回せば枠線が増える。キモいぐらいに。

グラデも搭載。思いっきり手抜きな実装してるにもかかわらずそれなりに見える。

あとは一々枠線や背景色設置するの激しくめどー、なのでそれなりに一括で付けられるように。

で、作ってて思ったんだが、JavaScriptでスタイル再設定とかするのは正直よろしくねーなー、と。

基本的にDOMを扱うので実際に動くのはページの読み込みが完了した後。つまり、一瞬でも設定されてない状態が表示されてから設定されることが多発するわけで、その瞬間がどーしても嫌だなーとか思うわけですよ。

まあ、内部的にはそこまでメンドイことしてないんで直接CSSに書き込んだりしてもいいとは思うが・・・それはそれでローカルソースに内容に関係ない要素一杯とかでなんかムカつくのぅ。

となると・・・やっぱりPHPあたりで生成するのが一番なのかもしれんなーとか思ったり。もしくはCSS3が標準装備されて背景画像が複数設定可能になればみんな幸せになれるんだが、一体何年後になるんだ?

Info

2006
0120

Tagscssjavascript

JavaScriptで枠付き丸角をつける

Nifty Cornersを見た後、これ利用すれば枠付きもいけるんでね? というわけで作ってみた。

サンプル

中のpaddingとかmarginとかに左右されるんで、スクリプト設置してすぐに丸角ってわけにはいかないのね。

そこらへんを解消しようと思ったが、スクリプトでさらにスタイル設定したり消したりする必要があるんで、なんか面倒になったんでやめた。がんばれば枠の太さも設定できそうだがさらにめどい。

そこまでする必要がこの枠付き丸角にあるんかね? と思ったが、CSS2だか3の丸角が結構汚いんで作る価値はあるかもしれん。

そういや作ってる時に思ったんだが、丸角になると1ドットにこだわりたくなるのは何故なんだろう? いや、美しい曲線を描くには1ドットのズレも許されないわけなんだが、ちょいと色変えてグラデかませばいいじゃんとか思いつつも単色で曲線。むぅ・・・

Info

2006
0117

Tagscssjavascript

CSSによる段組を非推奨してみる

このようなページに最近やたらと遭遇する。あとは段組関係ないけどline-height指定がおかしくて行が重なってるとか。

こーゆーのを見ると、中途半端な組み方されるよかテーブルレイアウトでガチガチなほうがいいなぁと心から思った。

あと、スタイルシート無効機能、最高。正直これが無いと殺人レイアウト(font-size:9pxとか)相手に生き抜くことができんと実感した。や、Firefox使えば解決するけどね。崩れるページに遭遇する確率もアップするが。

Info

2006
0108

Tagscss

暴満館

最新のエントリ
注目のエントリ(はてな)
ゲーム攻略

暴満館 ~The House of Full Violence~
Powered by WordPress.
About | Contact | 新着のエントリ情報 RSS

ページ内の見出し一覧
枠付きグラデで四角い角を丸くする - Nifty++
JavaScriptで枠付き丸角をつける
CSSによる段組を非推奨してみる