language_and_engineering https://blog.hatena.ne.jp/language_and_engineering/ 主に言語とシステム開発に関して https://language-and-engineering.hatenablog.jp/ javascript デザイン css jQuery HTML要素の背景にグラデーションをかけたい場合，色つきの画像をそのボックス要素の大きさに合わせて作り，背景として指定する方法がある。 しかし画像をいちいち個別に作るのは面倒だ。 （CSSで背景画像のサイズを自動調整する方法は無い。貼る個所のサイズに合わせて作っておく必要がある。） また，テキストや要素に影（ドロップシャドウ）をつけたい場合，CSSを工夫して何段もうっすら重ねるなどの方法がある。 でもこれも，全ての段を手で書いて微調整していくのは苦痛だ。 実はこれらの作業は，JavaScript (jQuery) で簡単にできる。 例えば右上のイメージのようなページを作りたい場合，下記のコード… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Flanguage-and-engineering.hatenablog.jp%2Fentry%2F20090124%2F1232790532" title="　グラデーションや影を，JavaScriptで付ける方法　（画像を使わず jQuery だけでクロスブラウザなWebデザイン） - 主に言語とシステム開発に関して" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> http://cdn-ak.f.st-hatena.com/images/fotolife/l/language_and_engineering/20090124/20090124181834.png Hatena Blog https://hatena.blog 2009-01-24 18:48:52 rich https://language-and-engineering.hatenablog.jp/entry/20090124/1232790532 1.0 100%