3月中に出すって言ってたmodern.IE日本語版が先日公開されていて、 ホーム | Internet Explorer の検証がより簡単に | modern.IE ※どうでもいい話だけど、modern.IEはレスポンシブデザインだったりする 複数メディアで取り上げられてた。 マイクロソフト、ブラウザーの互換性検証サイト「modern.IE」日本語版を公開 -INTERNET Watch ニュース - 日本MS、Webサイト検証ツール「modern.ie」の日本語版を公開：ITpro マイクロソフト、Webページ検証サイト「modern.IE」の日本語版を公開 | 開発・SE | マイナビニュース 提供サービスは2つ。 ・有料：検証webサービス(2014年1月10日3ヶ月まで無料キャンペーン中 ※要Facebookアカウント) ・無料：検証用仮想環境の配布 検証用仮想環境は幅広く対応して
Internet Explorerのテストって手間ですよね。 そもそも古いInternet Explorer（6-8）には対応したくないものですが、そうも言っていられないのが普通で嫌々対応することになると思います。IE8以上にあるF12開発者ツールやIE Testerなんてありますが、今回は少し前から話題になっていたInternet Explorerの実行環境を仮想マシンとして作れるmodern.IEを使ってみることにしました。 今回はMacOSのVMWareを前提として紹介します。 VMWare Fusionとは VMware Fusion 5 は、Mac 上で Windows プログラムを実行するための、ホーム ユーザーに最適な、迅速、容易、かつ信頼性に優れたソリューションです。 VMware Fusion VMWare Fusionの良いところ 私自身もつい最近使い始めたもので詳しく
modern.IEというIEの検証のために色々できるサイトができて、ここでIEのVMのイメージを落とすことができる。Virtual Box、VMWare Fusion、Parallelsとメジャーなものは全部対応してる。すごい。 とりあえずMacのVirtual BoxにIE10 Win8をいれてみた。まず以下からからMacとVirtual Boxを選んで「IE10 - Win8」の.sfxとかの.rarのファイルを全部ダウンロードする。 http://www.modern.ie/ja/virtualization-tools 「.sfx」というのがよくわからんかったけどなんか圧縮形式らしくて実行権限つけて実行すれば解凍されるらしい。 $ chmod +x IE10.Win8.For.MacVirtualBox.part1.sfx $ ./IE10.Win8.For.MacVirtualB
modern.IEでは仮想PCを使用したIEの表示テストツールが提供されてます。これを使用するとWindows以外のOSでも複数バージョンのIEのテストが行えます。 追記：modern.IEの日本語版ページが開設されました。 ホーム | Internet Explorer の検証がより簡単に | modern.IE はじめに modern.IEのVirtual toolsページではIEのテストツールが提供されてます。 「Local virtualization」では各OS、各仮想化ソフトウェア用のWindows&IEファイルが用意されてます。OSはWindows、Mac、Linux、仮想化ソフトウェアはVirtualBox、VMWare Fusion、Parallels、Virtual PCなどに対応しています。 ここではMacでVirtualBoxを使用してIEを起動させる方法を紹介しま
2011年の9月に「CSSとSVG filterでガラスっぽい効果をつける」というのを書きましたが、これはFirefoxのみを対象としたものでした。 そこで今回はできるだけ多くのブラウザに対応したものを作ってみます。 完成品Frosted glass effect with CSS & SVG 背景画像にはWetFoto.comによる#246 Wetlook with Beautiful Brunette in Leggings and Jacket. Girl in black jacket, white wetlook leggings and skirt in boots, get wet fully clothed in the sea.を使用しています（リンク先はFlickrです）。 この画像はCC BY-NC-SA 2.0でライセンスされています。 背景画像にはBeryl Ch
このブログで何回か紹介している0to255というオンラインツールですが、かなり便利だと思うので使い方を説明してみます。 色に関する知識が乏しい私ですが、0to255を使うとまとまった感じの配色になるので重宝しています。今回は0to255を使ってメニューを作る際の色選びをしてみます。 0to255の使い方 まず、0to255の使い方についてですが、下の画像のように「PICK A COLOR」をクリックしてカラーコードを入力します。 今回は「#ff7400」を指定してみます。 すると、指定した色より明るい色と暗い色がグラデーションになってたくさん表示されます。近い色がたくさん表示されますので、これらをうまく使うとまとまった感じのメニューが作れます。 メニューの配色を決める ということで、以下のような配色でメニューを作ってみます。 メニュー背景のグラデーションと境界線の1pxラインに使う色を選ん
吹き出し風デザインの実装イメージ .tooltip { position: relative; background: #eaeaea; cursor: help; display: inline-block; text-decoration: none; color: #222; outline: none; } .tooltip span { visibility: hidden; position: absolute; bottom: 30px; left: 50%; z-index: 999; width: 230px; margin-left: -127px; padding: 10px; border: 2px solid #ccc; opacity: .9; background-color: #ddd; background-image: -webkit-linear-gr
Custom Login Form Styling 下記は各ポイントを意訳したものです。 「使いやすい」フォームをつくるポイント 「使いやすい」と「かっこいい」を両立したフォームの実装 「使いやすい」フォームをつくるポイント ログイン、コメント、コンタクト、フィードバックなど、フォームの入力には多くの時間がかかります。もしフォームが使いにくいものであれば、それはあなたがユーザーを混乱させていると言ってもよいでしょう。 フォームをより使いやすく、ユーザフレンドリーにするポイントがいくつかあります。 ラベル ここで言う「ラベル」はlabel要素のことではなく、フォーム上に表示されるラベルです。ラベルは明確にしておく必要があり、この情報によってユーザーはそこに何を入力するべきか知ることができます。 ラベルにはアイコンなどを使って、ビジュアル的に理解を深めるようにしてもよいでしょう。 フィールド
たまには、ゆるめなCSSの話題でも。 対象ブラウザがIE7からになる事で、活用できるセレクタの幅はわりと広がります。 普段、IE6の対応が必須となってると、使ってないセレクタっていざ使おうとしても活用方法が分からなかったりしますよね。うん。 と言うことで、隣接セレクタ (E + F) を使った実用的？かも知れないネタでも。 なんちゃって、しましま ある程度要素の数が決まってる場合、隣接セレクタを使えばIE7から対応でしましまが実現できます。 <ul class="sampleList"> <li>あいうえお</li> <li>かきくけこ</li> <li>さしすせそ</li> <li>たちつてと</li> <li>なにぬねの</li> </ul> ul.sampleList { list-style: none; margin: 0; padding: 0; border-top: 1px
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く