Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

Category Archives: Web Design

[WEB DESIGN – CSS] Dotted image border

  • Pocket
  • このエントリーをはてなブックマークに追加

BORDER=0主にウェブ製作者が喜ぶTips。CSSで書くボーダーって、Solid表示以外にもDottedとかありますよね。けどアレってブラウザによって見え方がまちまちで、「ちゃんとSafariみたく表示せんかいdrftgyふじこ!!」ってなった経験ありません? わたしはございますので最近じゃボーダー指定はめっきり使わなくなってしまいました。こちらではその解決策を画像のbackground表示によって解決してます。白黒ドットの2×2のgifを1枚用意して、そいつを特定のDivなどのコンテナbackgroundに指定。あとはそこに画像を放り込んで、paddingを1pxにすればオッケ。コチラではその応用例が掲載されてます。imgタグの白ボーダーと組み合わせるってのもイイ感じ。2×2のドット絵も上がっています。早速仕事で使えそうな小技ですね。
Dotted image border >>

[WEB DESIGN] Ajax Tabs Content script

  • Pocket
  • このエントリーをはてなブックマークに追加

BORDER=0Ajaxを使ったリロードなしのタブ表現。ってか非同期通信がある事がAjaxの定義だと思ってるけど、コレってただのJavaScriptによるDIV内差し替えだよね? まぁ細かい事は抜きにして、仕事的に使い勝手が良さそうなのでメモ代わりのエントリ。タブによる表現ってユーザーが今何を見てるのかについて視覚的に分かりやすいから使いやすいんだよね。抽出したコンテンツや問い合わせ内容の切り替え、他にも色々と使える場面がありそうです。.zip形式でソースDLできます。
Ajax Tabs Content script >>