WebページをRetina対応させるテクニック～基礎知識編
WebページをRetina対応させるテクニック～基礎知識編：jQuery×HTML5×CSS3を真面目に勉強（4）（1/2 ページ） iPhoneのRetinaディスプレイは、Webページの制作フローにも大きな変化をもたらした。WebページをRetina対応させるにはどうすればいいのだろうか。 はじめに 2010年6月に登場したアップルのiPhone 4には「Retinaディスプレイ」と呼ばれる、それまでの常識を覆した高精細なディスプレイが搭載されました。それ以降、スマートフォンやタブレットといったモバイル端末のディスプレイはより解像度の高いものへと進化していき、2013年の初めにはサムスン電子のGALAXY S4やソニーモバイルのXperia Zなど、フルHD画質対応（1920×1080ピクセル）のディスプレイを搭載したスマートフォンが登場するまでになりました。 高精細ディスプレイの登場
HTML5でサイトをつくろう
若者を中心に爆発的な人気となり、ユーザーを増やし続けているInstagram。Web関連の仕事をしていると、最近ではクライアントからも「Instagramを使いたい」という要望も聞くようになりました。Instagramが今どうなっているのか？どう活用し、どのように見てもらうのか、初歩的な内容から少し専門的な内容まで、参考になるサイトや記事をまとめました。
ASCII.jpリファレンス
サービス終了のお知らせ ASCII.jpリファレンスはサービスを終了しました。2009年のサービス開始以来、長きにわたりご利用いただき、ありがとうございました。 2017年10月5日 株式会社KADOKAWA Web Professional編集部
[CSS]floatを解除する「clearfix」のIE6/7に対応した改良版
floatを解除する際にclearを使用せずに解除する「clearfix」の改良版をPerishable Pressから紹介します。 The New Clearfix Method いわゆる旧タイプのclearfixはMac IEも対応ブラウザに含まれているため、スタイルシートは下記のようになります。 旧タイプのclearfix <textarea name="code" class="css" cols="60" rows="5"> .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .clearfix { display: inline-table; } /* Hides from IE-mac */ * html .cle
【CSS】見出しの横に「更新日」とか並べて表示したい時の簡単なCSSの書き方 | バシャログ。
上記の画像のように、見出しのタイトルに更新日などの情報を並べて表示する、というデザインがよくあります。 実現方法は色々ありますが、CSS でどのように実現するのが簡単でしょうか。 例えば、HTML は以下です。 <div id="press-release"> <h2>プレスリリース</h2> <p class="update">2009年03月09日更新</p> <!-- /#press-release --></div> 良く見かけるのは h2 と p をそれぞれ「position:absolute」で左と右に配置するもの、もしくは h2 を「float:left」、p を「float:right」にする方法です。 どちらを使うにせよサンプルの HTML のように h2 と p を div で囲う必要があり、CSS も長くなりがちです。 以下の方法が最も楽チンだったりします。 HTML
ブロックレベル要素の高さを揃えるheightLine.js[to-R]
ブロックレベル要素の高さを揃えるheightLine.js Web標準の日々のグループディスカッションで出たライブラリ案を作っていく企画、第一弾。 ブロックレベル要素の高さを揃えるjsライブラリを作ってみました。 このライブラリは新バージョンがあります。 レスポンシブWebデザインに対応した「jquery.heightLine.js」 CSSでは複数のブロックレベル要素の高さを揃えれないという問題があります。 このheightLine.jsは、複数のブロックレベル要素の高さを揃える事ができ、2カラムレイアウトや3カラムレイアウトのそれぞれのカラムの高さを揃えたり、複数のブロックレベル要素をfloatで配置する際の高さを揃えたりできる、便利なライブラリになります。 設置方法 head要素内にダウンロードしたheightLine.jsを読み込みます。 <script type="text/ja
![ブロックレベル要素の高さを揃えるheightLine.js[to-R]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Fblog.webcreativepark.net%2Ficon_200x200.png)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
イマドキCSS設計
デザインを制すための10個の余白系CSSプロパティ
連載インデックス「WebデザイナのためのHTMLチューニング入門」 - ＠IT