本日はレスポンシブデザインの表現方法について。スマホでは何も指定しなければブラウザはウェブサイトの幅が980pxと仮定しています。要は通常の980px分をそのままiPhoneの画面に収まるよう縮小した状態で表示されます。これを解決するために、動的に幅を変更させることができるが、viewportというタグです。content="width=○○"/>という一文をいれれば、その幅に合わせた表示をします。それ以外にも下記のように記すと閲覧している端末の画面幅と同じ数値が適用されます。webサイトがレスポンシブに設定されている場合にはこのタグがのぞましいです。initial-scale=1"/>このタグのいみですが、幅をデバイスに合わせるという意味です。そのまんまですね・・・initial-scaleは0.5とかとやるとデバイスの幅の半分になります。http://qiita.com/ryounagaoka/items/045b2808a5ed43f96607http://keicode.com/mobile/viewport.php他、注意点なんぞを。border-box;を指定し、パディングとボーダーを幅と高さに含める。コメントをキャンセルメールアドレスが公開されることはありません。*ウェブサイト関連記事オートコンプリートのプラグイン最近だとフォームの入力画面で最初の数文字を入力すると候補を予測して表示してくれる機能(=オートコンプリート)があることが一般的ですね。カスタムディレクティブAngularはHTMLの中にng-clickなどと書いておけばイベントを紐づけて、特定動作時にメソッドを呼び出すことができます。これをオリジナルで自作することができます。...ページレイアウトに関して今回からは単一のページレイアウトの構成の考え方やテクニックについて。一般的な傾向として、人間の視覚上の特徴というのは下記のような傾向があげられます。...画面系小ネタposition:sticky+datalist(プルダウン+自由入力)画面系の小さい小ネタなど。...CSSを書くときのコツ前回のCSSのルールを踏まえて、今回はCSSを書くときの概念的なルールです。