斜線やストライプの背景画像を Photoshop とかで作ると、色を変えたくなった時にそのたび作り直しってのが面倒。便利で使ってる人も多いかもしれない secondlife さんの Background Image Maker でもそれは同じかな。んで、Photoshop とかで作る場合に、線に色を付けて作るんではなくて、色を付けたい部分を透過にして作っておいて CSS で background-color を指定するやり方にすれば、色を変えたくなった時はCSS で背景色を変更するだけで良いじゃんって、Super Stripes を見て目からうろこ状態。早速インスパイヤしてみた！ 使ってみたい GIF 画像をダウンロードして、CSS で背景画像に。あとは、背景色で好みの色を指定するだけ。ちなみに、サンプルでは背景色を #fa0 と指定している。 斜線 oblique-line_1px.gi
タグ
- すべて
- css (22)
- iPhone (32)
- jQuery (30)
- *2ch (32)
- *Flash (72)
- *Gmail (173)
- *Mozilla (25)
- *Template (16)
- *Thunderbird (183)
- *Twitter (50)
- *WebAPI (22)
- *ad (14)
- *adobe (14)
- *air (41)
- *ajax (45)
- *amazon (11)
- *art (82)
- *as (25)
- *blog (59)
- *book (22)
- *browser (16)
- *business (25)
- *cms (25)
- *css (205)
- *db (12)
- *design (219)
- *development (52)
- *editor (11)
- *english (21)
- *firefox (1799)
- *font (39)
- *gadget (16)
- *game (17)
- *generator (52)
- *google (3408)
- *gtd (15)
- *icon (29)
- *idea (18)
- *igoogle (16)
- *iphone (75)
- *java (39)
- *javascript (991)
- *jquery (127)
- *life (22)
- *lifehack (1208)
- *lifehacks (61)
- *linux (45)
- *mac (17)
- *marketing (12)
- *mashup (20)
- *material (12)
- *mobile (85)
- *ms (92)
- *music (21)
- *mysql (12)
- *neta (1261)
- *network (12)
- *opensource (23)
- *opera (66)
- *photo (173)
- *photoshop (284)
- *php (202)
- *portable (19)
- *programming (710)
- *ruby (23)
- *security (83)
- *seo (68)
- *software (197)
- *storage (29)
- *tips (62)
- *tool (72)
- *tools (13)
- *wallpaper (19)
- *web (72)
- *webapp (12)
- *webdesign (210)
- *webservice (605)
- *webtool (15)
- *webサービス (58)
- *webデザイン (48)
- *web制作 (553)
- *web素材 (24)
- *web製作 (33)
- *windows (14)
- *wordpress (47)
- *youtube (28)
- *zoho (39)
- *まとめ (24)
- *仕事 (17)
- *仕事術 (29)
- *動画 (32)
- *画像 (32)
- *素材 (23)
- .NET Framework (14)
- .net (36)
- 2011 (15)
- 2012 (19)
- 2ch (102)
- 3d (71)
- AR (23)
- Azure (16)
- Chrome OS (17)
- DNS (28)
- Facebook (146)
- FirefoxOS (14)
- GAE (12)
- Google Apps (12)
- Google Buzz (24)
- Google Reader (47)
- Google Wave (19)
- Google+ (26)
- GoogleChrome (25)
- IT (14)
- Mozilla (42)
- SIer (13)
- Steve Jobs (15)
- UNIX (48)
- actionscript (56)
- ad (15)
- adobe (55)
- adobe air (16)
- adsense (15)
- affiliate (32)
- air (56)
- ajax (278)
- algorithm (26)
- amazon (48)
- analytics (13)
- android (453)
- anime (17)
- apache (39)
- api (176)
- apollo (17)
- app (45)
- apple (41)
- application (21)
- apps (20)
- art (189)
- as3 (27)
- au (25)
- backup (43)
- blog (299)
- blogger (13)
- blogparts (28)
- book (126)
- bookmark (51)
- bookmarklet (60)
- bootstrap (13)
- bot (12)
- browser (156)
- business (870)
- c (12)
- c# (14)
- c++ (18)
- cakephp (23)
- calendar (94)
- camera (20)
- canvas (16)
- capture (12)
- centos (23)
- chat (31)
- cheatsheet (17)
- china (13)
- chrome (169)
- cloud (52)
- cms (89)
- code (41)
- color (57)
- comic (30)
- command (25)
- communication (118)
- community (15)
- copyright (23)
- css (307)
- css3 (34)
- c言語 (28)
- database (49)
- db (34)
- debug (40)
- design (403)
- desktop (52)
- dev (27)
- developer (69)
- development (315)
- dictionary (13)
- django (12)
- docomo (29)
- document (22)
- domain (17)
- download (27)
- dropbox (68)
- dvd (13)
- ec (15)
- eclipse (48)
- editor (71)
- emacs (36)
- engineer (15)
- english (166)
- event (44)
- evernote (108)
- excel (71)
- extension (167)
- extensions (15)
- favicon (24)
- feed (22)
- finance (16)
- firebug (19)
- firefox (459)
- flash (195)
- flex (15)
- flickr (83)
- font (195)
- food (108)
- framework (170)
- free (49)
- gadget (94)
- game (195)
- generator (184)
- git (32)
- github (13)
- gmail (539)
- google (372)
- google adsense (17)
- google analytics (12)
- google app engine (35)
- google calendar (60)
- google chrome (167)
- google docs (16)
- google earth (24)
- google maps (34)
- graph (13)
- greasemonkey (111)
- groupware (16)
- gtd (147)
- hatena (125)
- health (70)
- history (16)
- html (48)
- html5 (148)
- iOS (32)
- iPad (14)
- icon (114)
- ide (16)
- idea (57)
- ie (51)
- igoogle (39)
- illustrator (38)
- im (28)
- image (80)
- internet (20)
- interview (26)
- iphone (385)
- jQuery Mobile (13)
- japan (21)
- java (156)
- javascript (693)
- jquery (218)
- language (14)
- library (186)
- life (83)
- lifehack (295)
- lifehacks (65)
- linux (205)
- livedoor (33)
- logo (13)
- mac (199)
- mac os x (18)
- magazine (12)
- mail (99)
- management (46)
- map (88)
- marketing (78)
- mashup (60)
- material (48)
- media (34)
- memo (15)
- microsoft (249)
- mindmap (51)
- mixi (32)
- mobile (336)
- money (47)
- movie (60)
- mp3 (32)
- ms (82)
- music (225)
- mysql (58)
- neta (246)
- network (66)
- news (38)
- niconico (13)
- node.js (12)
- office (68)
- openid (21)
- openoffice.org (14)
- opensource (26)
- opera (147)
- oracle (18)
- os (25)
- oss (50)
- p2p (20)
- password (24)
- pc (23)
- pdf (92)
- performance (44)
- perl (66)
- photo (357)
- photoshop (178)
- php (413)
- picasa (12)
- plugin (44)
- portable (17)
- presentation (47)
- programming (423)
- project (13)
- prototype.js (28)
- python (82)
- radio (12)
- rails (77)
- reference (19)
- remember the milk (16)
- rss (51)
- rtm (13)
- ruby (143)
- ruby on rails (31)
- safari (16)
- sbm (17)
- schedule (13)
- science (18)
- search (244)
- second life (39)
- security (566)
- seo (151)
- server (61)
- shell (42)
- silverlight (27)
- skype (28)
- sns (97)
- social (27)
- software (1172)
- space (12)
- spam (22)
- sql (15)
- startup (36)
- storage (130)
- study (58)
- subversion (23)
- technology (35)
- template (54)
- test (23)
- testing (18)
- thunderbird (157)
- tips (314)
- todo (70)
- todo管理 (46)
- toodledo (48)
- tool (346)
- tools (21)
- travel (31)
- tumblr (15)
- tutorial (109)
- twitter (850)
- ubuntu (40)
- ui (145)
- unclassified (26557)
- usability (26)
- usb (18)
- utility (16)
- video (58)
- vim (50)
- vista (34)
- vmware (21)
- wallpaper (55)
- web (178)
- web 2.0 (14)
- web design (46)
- web service (39)
- web2.0 (52)
- webapi (35)
- webdesign (501)
- webservice (2399)
- webtool (33)
- webサービス (87)
- webデザイン (62)
- web制作 (126)
- wiki (41)
- windows (405)
- windows 7 (45)
- windows7 (18)
- wordpress (140)
- work (25)
- writing (24)
- yahoo (28)
- yahoo! (37)
- youtube (165)
- まとめ (96)
- まとめサイト (110)
- アイコン (13)
- アイデア (21)
- アクセス解析 (35)
- オンラインストレージ (22)
- オープンガバメントラ (14)
- オープンソース (21)
- クラウドファンディン (15)
- グループウェア (14)
- コミュニケーション (35)
- スケジュール (17)
- スケジュール管理 (29)
- スマートフォン (45)
- ソーシャルメディア (23)
- タスク管理 (100)
- ツール (33)
- テンプレート (19)
- デザイン (14)
- ニコニコ動画 (22)
- ネタ (33)
- バージョン管理 (14)
- フリー素材 (31)
- ブログ (16)
- プレゼン (14)
- プログラミング (13)
- プロジェクト管理 (44)
- マーケティング (31)
- メモ (12)
- メール (22)
- モチベーション (20)
- 中国 (19)
- 仕事 (76)
- 仕事術 (277)
- 健康 (22)
- 写真 (48)
- 勉強 (17)
- 動画 (63)
- 名刺 (16)
- 学習 (44)
- 宇宙 (41)
- 広告 (56)
- 心理 (23)
- 拡張機能 (12)
- 整理 (12)
- 文章 (14)
- 文章術 (23)
- 検索 (41)
- 正規表現 (24)
- 生活 (27)
- 画像 (84)
- 画像処理 (32)
- 画像編集 (12)
- 睡眠 (33)
- 素材 (82)
- 経営 (12)
- 翻訳 (34)
- 考え方 (12)
- 英語 (39)
- 英語学習 (18)
- 資料 (21)
- 起業 (29)
- 開発 (26)
- 電子書籍 (37)
- 食 (16)
- 高速化 (17)
- unclassified (26557)
- *google (3408)
- webservice (2399)
- *firefox (1799)
- *neta (1261)
- *lifehack (1208)
- software (1172)
- *javascript (991)
- business (870)
- twitter (850)
CSSとGIFに関するkomzのブックマーク (1)
-
komz 2006/09/06
- webデザイン
- webdesign
- CSS
- GIF
リンク -
1
公式Twitter
- @HatenaBookmark
リリース、障害情報などのサービスのお知らせ
- @hatebu
最新の人気エントリーの配信
処理を実行中です
キーボードショートカット一覧
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
設定を変更しましたx