【レビュー】自由に使えるiPhone/iPad/Android/PC向け切り分けCSSテンプレート | エンタープライズ | マイコミジャーナル
Fantastic website design in Flintshire, North Wales from Stuff and Nonsense iPhoneやAndroid携帯といったスマートフォンからiPadのようなポータブルデバイス、従来のPCやノートPCにいたるまで、ネットワークにアクセスするデバイスの種類は多様化している。こうしたディスプレイサイズも解像度密度も異なるデバイスに対してそれぞれに適したデザインを提供するというのが、最近のWebデザイナの間で取り上げられることが多いトピックになっている。 こうしたトピックで取り上げられることが多いテクニックがCSS3のMedia Queryを使う方法だ。デバイスの解像度や密度の情報を取得して、それに応じて適用するCSSを切り替えるというもの。これまで多くのブログでこのテクニックが取り上げられ、サンプルコードとともに紹介されている
もうCSSハックは必要なし!? ブラウザ毎にCSSを切り替える「cssuseragent」 | Web活メモ帳
CSSでページをデザインする際に、ブラウザ毎のレイアウトの違いって本当に嫌ですよね。 CSSハックで対応する方も多いかと思いますが、本日紹介する「cssuseragent」を使うとclassの作り方を少し工夫するだけでより柔軟に対応できるようになります。 詳しくは以下 設定方法はJavaScriptを一つ読み込むだけになります。 <script src="cssua.min.js" type="text/javascript"></script> このライブラリを使うと、ページのhtml属性に動的にclass属性を追加するようになります。 例えばですが、IE6でアクセスした場合には ua-ie-6というclass名が追加されるようになります。 <html class="ua-ie-6"> <head>…</head> <body>…</body> </html> iPhoneの場合はua-
『続・ハイパフォーマンスWebサイト』イベントに参加しました
こんにちは。Yahoo!検索の高林です。先日、書籍『続・ハイパフォーマンスWebサイト』（オライリー刊）に寄稿させていただいた関係でトークイベントに参加してきました。 お忙しいところ、たくさんの方々に出席していただき、ありがとうございます。 今回のイベントでは、「Yahoo!検索のパフォーマンス向上策全て見せます！」というテーマでYahoo!検索で実際に行っているTipsの紹介と現在、Yahoo!検索で検討しているシステム構成などを発表しました。 そのときの発表内容は、以下のリンクから確認できますのでご興味のある方はご覧ください。 『続・ハイパフォーマンスWebサイト』出版記念トークイベントのビデオを公開 (O'Reilly Japan) トークセッションでは来場者の方々にたくさんの質問をいただきました。今回はそのなかからいくつかピックアップしてご紹介したいと思います。 ――Q: Yaho
MacRuby: The Definitive Guide
Build the skills your teams need Give your teams the O’Reilly learning platform and equip them with the resources that drive business outcomes. Click on a feature below to explore. Trusted content Live online events Courses Interactive learning Certification prep O’Reilly Answers AI Academy Assignments Insights Dashboard Trusted content you can count on More than 60K titles from O’Reilly and nearl
テキストボックスを画像の下に回り込ませない方法｜web bibo
/* CSS（スタイルシート）に関する知識・テクニックなどの備忘録 */ 文字サイズ 大 中 小 現在のページ： HOME » CSS レイアウト・ボックス » テキストボックスを画像の下に回り込ませない方法 画像のサイズが変わっても、隣接するテキストボックスは画像の下に回り込まず、なおかつ、テキストボックスのサイズが画像に合わせて自動的に変わる方法をご紹介します。 画像のサイズが変わってもテキストが折り返さない 大きい画像から小さい画像に差し替えることになっても、テキストが折り返すことはなくなるので、簡単に更新作業ができます。 HTML 下記の通りHTMLを記述します。 <div class="box"> <img src="images/text_wrap.jpg" alt="" /> <p>text text text text text text tex
知っておいて損はないAJAXやCSSを駆使したタブインターフェース18種類 - GIGAZINE
技術的知識が無くてもタブを作れるフリーソフトからかなり派手な効果を伴うタブ作成ライブラリ、Yahoo！やGoogle、Adobeの作ったタブまで、いろいろと応用が利いて独自の特徴があるものをざっくりと18種類ほどピックアップしてみました。 いろいろなページやブログで頻繁に見かけるタブ方式のメニューですが、こうやって並べてみると実は見せ方も使い方も種々様々であることがよくわかります。 まずは知識不要でタブが簡単に作成できる「CSS Tab Designer」。Windows用のフリーソフトで、約60種類ものデザインが用意されています。その中にタブ方式のメニューもたくさん用意されており、ほかにも縦型のメニューやZDNet風メニューなども用意されています。 OverZone Software - CSS Tab Designer 細かいカスタマイズが可能なタブメニュー。画像を使ったサンプルも用意
Business Logs » Blog Archive » My 5 CSS Tips
Helping companies communicate better with their customers through the use of weblogs and smart user interface design. After reading “5 Steps To CSS Heaven” over at pingmag.jp, and disagreeing with some of what was said I thought that writing this would be appropriate. I’ve been writing CSS professionally now for about 2.5 years so here are 5 quick tips that help me out in my day to day work. I wou
Pure CSS menus
Navigation Skip navigation. Site search Site navigation How To Create home Tutorial links CSS tutorial This uses just CSS 2 to turn nested lists into a working menu and does not use any JavaScript (except in IE 5.5-6 on windows where I use the proprietary DHTML behaviours, because its CSS handling is not good enough to work this menu without script) This works in Mozilla 1+, Netscape 7+, Opera 7+,
CSS / DHTML Hybrid Navigation Bar
Inspired by Eric Meyer's pure CSS menus and the recently re-vamped DevEdge, I created this hybrid of CSS and DHTML, based on a simple unordered-list. Since the core data is HTML, it degrades all the way back to white text on a black background. It's coded to work up to six levels deep, but this can easily be extended, with just two lines of CSS per additional level. The whole thing, including the
Pure CSS Menus
pure CSS menus css/edge complexspiral ...devolved ...distorted Pure CSS popups curvelicious slantastic slanty claus? ragged float boxpunch For some time now, I've had this idea that if one could apply :hover to arbitrary elements, all kinds of possibilities would open up. Sure, we can do nifty stuff with hyperlink hovering, such as popup text and images, but to be able to apply hover styles to any
Litebox- Same great taste, less calories
Litebox Check out the front page If you haven't been to the front page in some time, check it out. I've started blogging about some tips and tricks. Expect some full featured scripts some time soon. What is it? Litebox is a modified version of Lightbox v2.0 created with one thing in mind, size reduction. Litebox utilizes the 3kb javascript library moo.fx in association with prototype.lite, giving
Hot Dates with CSS | The Montoya Herald
A Single Article Read it, comment, and share it with your friends Update July 9, 2006: As per the suggestions in the comments, I’ve updated this demonstration. The markup is now much more semantic. It might be hard to believe that CSS can get you hot dates, but listen up and I will explain how. I’ve been working on a new site and this site includes a blog. I decided that simple text dates wouldn’t
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Using LESS with WordPress
Things You Might Not Know About Conditional Comments
Background Desires | CSS-Tricks
straightline bookmark | Web design bookmarking
ikesai.com
SitePoint CSS Reference
https://modernlifeisrubbish.co.uk/web-2.0-colour-palette.asp
CSS Layouts - Code-Sucks.com