スマートフォン対応でよく使うhtml、css、javascriptのまとめ
スマートフォン(ios、android)向けのウェブサイト・ウェブアプリを作る際に個人的によく使うhtml、css、javascriptの備忘録。 html関連 headタグ内での設定<!-- //デバイスサイズにあわせて表示領域を変更する --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- //電話番号のリンクを無効化 --> <meta name="format-detection" content="telephone=no"> <!-- //ホーム画面用アイコン --> <link rel="apple-touch-icon" href="icon.png"> <!-- //ホーム画面用アイコンの光沢を無効化する --> <link rel="apple-touch-icon
CSS拡張メタ言語「SCSS(Sass)」と「LESS」の比較 - (DxD)∞
CSSを拡張するためのメタ言語として、代表的なものに「SCSS(Sass)」と「LESS」があります。今回、導入を検討するにあたり、両者を比較しました。 結果的には、「SCSS(Sass)」を導入することにしましたが、特に「SCSS(Sass)」を選択する決め手となった点に重点を置きつつ、両者の違いをまとめまてみました。 はじめに Webサイト、Webアプリケーションが大規模になるにつれて、CSSの設計・管理にもリソースを割かれるようになります。CSSのモジュール化、コンポーネント化による再利用性を考えたとき、現状のCSSを取り巻く状況は十分とは言えません。 一つの選択肢としてあがるのが「Blueprint」や「960 Glid System」等のCSSフレームワークの利用ですが、その再利用性と構造・表現の分離度はトレードオフです。 そこで、CSSの利点を活かしつつ、再利用性を高めるために
CSS3について知っておきたいことのまとめ
CSS3には興味深い様々なプロパティがありますが、これらを勉強するにあたって知っておきたいCSS3の基礎をまとめてみます。 過去の記事に手を加えたものや新たに書いたものなど幅広くまとめてみましたので、ぜひ抑えておいてください。 今回は結構ボリュームもあるので目次を作っています。 1. スタイルシートの構造 CSS3に限ったことではないですが、CSSの構造は下の図のように、セレクタ、プロパティ、値となっています。 もちろんプロパティと値は一対です。CSSといえば、プロパティのイメージが強いですが、セレクタも結構奥が深いです。 CSS3ではセレクタもプロパティも新たに追加されていますので、違いをちゃんと理解しておきましょう。 2. CSS3セレクタ CSSセレクタはスタイルを適用する対象を選択するものです。普段何気なく使っているclassやidなどもセレクタの１つです。 CSS3セレクタはW3
NWMatcher - CSS3 Selector and Matcher
A Javascript CSS3 Selector and Matcher not using XPath Ongoing development and current work is now on GitHub: NWMatcher Sources NWMatcher 1.3.8.js is the latest update on Google Code. It is highly suggested to upgrade to this version. Source code, add-ons and unit tests can be downloaded from GitHub, there are both Prototype and jQuery selector unit tests. Version 1.3.8 is the current release, all
Sencha Presents Sencha Touch
業界初のHTML5モバイルアプリ用フレームワーク Sencha Touchを使えばタッチスクリーンを装備したApple iOSや Android端末上でネイティブアプリのようなWebアプリが開発可能です。 Web標準技術に準拠 Sencha TouchはHTML5、CSS3、JavaScriptに特化した世界初のアプリケーションフレームワークです。SSencha Touchはこれらの技術が持つ力を最大限に引き出し、かつ柔軟で最適化されたアプリケーション開発を可能にします。Sencha Touchでは、音声や動画を組み込む為のコンポーネントやデータをオフラインでも利用可能にするlocalStorageプロキシーなどでHTML5の機能が利用されています。またSencha TouchのスタイルシートではCSS3を最大限活用してとても堅牢なスタイリングレイヤーを実現しています。 このライブラリはそ
CocProxy | CodeRepos::Share – Trac
CocProxy めんどくさいことしない置換プロキシー 使い方 http://svn.coderepos.org/share/lang/ruby/cocproxy/proxy.rb をダウンロード `files' というディレクトリをつくる 置換したいファイルをてきとうにつっこむ ruby proxy.rb ポートとか表示されるのでブラウザの設定を変える デフォルトだと、 #{File.basename(req.path_info)}", #{req.host}#{req.path_info}", #{req.host}/#{File.basename(req.path_info)}", .#{req.path_info}", がスキャンされ、ヒットしたら置換されます。 例えば、http://example.com/test/foo/bar.css にアクセスすると files/bar.c
Latest topics > CSS3セレクタとXPathでの表現の対応表 - outsider reflex
Latest topics > CSS3セレクタとXPathでの表現の対応表 宣伝。日経LinuxにてLinuxの基礎？を紹介する漫画「シス管系女子」を連載させていただいています。 以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能！ « getElementsByなんちゃら の代わりにXPathを使う Main Mozilla 24 » CSS3セレクタとXPathでの表現の対応表 - Sep 13, 2007 拡張機能勉強会の時に焚き付けられた、Text Shadowのコード（textshadow.js）を教材にして拡張機能開発のノウハウを解説していくシリーズ。 XPathをノードの検索に活用する方法を紹介したけど、肝心のXPathが書けなきゃ意味がないわけで。でもXPathって、ノードセットがどうとかノードテストがどうとか軸がどうとか修飾がどうとか、い
jsdo.it
Come creare il miglior gioco da casinò Quando si progetta un gioco da casinò, la prima cosa che devi considerare è che tipo di gioco sarà. Ci sono molti diversi tipi di giochi da casinò, dalle slot e video poker ai giochi da tavolo e giochi di carte. Dovrai decidere quale tipo di gioco si adatta meglio alle tue esigenze. Ogni tipo di gioco ha il proprio set di regole e regolamenti, quindi dovrai a
JavaScript使ってないのに使ってる風のピュアCSSなテクニック集:phpspot開発日誌
30 Pure CSS Alternatives to Javascript - Speckyboy Design Magazine JavaScript使ってないのに使ってる風のピュアCSSなテクニック集。 最近ではCSS3等の登場によってCSSだけでもかなり高度なことが出来るようになっていますが、それらのコレクションがまとまっていました。 CSSだけでもこれだけのことが出来るという可能性を知るのに調度良いです。 マウスオーバーでハイライトする地図 タイムライン LightBoxもCSSで コンテンツスライダー スピーチバブル 無理してCSSのみにこだわる必要はありませんが、楽な選択肢を取れるなら覚えておいて損はありませんね。 関連エントリ ピュアCSSで実装された吹き出しのデザイン例色々 ピュアCSSで画像を壁に貼ったポラロイドギャラリー風にするサンプル クリーンなデザインでピュアＣＳ
13 jQuery SelectBox/Drop-down Plugins — SitePoint
How to Use jQuery’s ajax() Function for Asynchronous HTTP Requests
Highslide JS - JavaScript thumbnail viewer
What is Highslide JS? Highslide JS is an image, media and gallery viewer written in JavaScript. These are some of its advantages: Tip! Use the visual Highslide Editor to set up your Highslide installation without writing code. Quick and elegant looking. No plugins like Flash or Java required. Popup blockers are no problem. The content opens within the active browser window. Single click. After ope
When can I use... : Compatibility tables for features in HTML5, CSS3, SVG and other upcoming web ...
Browser Statistics
W3Schools offers a wide range of services and products for beginners and professionals, helping millions of people everyday to learn and master new skills. Free Tutorials Enjoy our free tutorials like millions of other internet users since 1999
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
stroll.js - CSS3 Scroll Effects
Primer
Home
Playstation mk2
The Acid3 Test