skillup

技術ブログ

「 HTML+CSS 」 一覧

no image

HTML/JS/JavaScriptのキャッシュ機能の無効化に関して

2017/03/10   -デザイン
 

AngularJSを使っていまして、更新したのにキャッシュ機能が働いていてブラウザでは変更が反映されてない・・・なんてことがちょいつづき、キャッシュを無効化する機能を調査しました。 まず通常のHTML …

no image

css写経学習で感じたこと

こっちのブログでも書いてますが、CSSを最近写経してて気づいたことがいろいろあるんでメモリます。 常時追加予定。 全体 最初に見取り図を描いて、どの要素とどの要素が共通性を持つかを考える。(いきなり組 …

no image

レスポンシブデザインの作成ポイント

2016/09/15   -UI, デザイン
 

本日はレスポンシブデザインの表現方法について。 スマホでは何も指定しなければブラウザはウェブサイトの幅が980pxと仮定しています。 要は通常の980px分をそのままiPhoneの画面に収まるよう縮小 …

no image

破綻しないCSSについて

業務では開発する人間があまりおらず、プログラム以外にもデザイン(CSSなどのレイアウト)やらサーバーやら一人ですべてやることが多いです。 CSSなんかは最初に触ってから4,5年は立ちますけど、系統的に …

no image

HTML5について

CSSのサンプルを書いていく途中で、HTML5タグが出来てたので簡単におさらいです。 HTML5のメリット 動画の埋め込みなどが比較的簡単にできる 新しいタグが作られ、よりHTMLをすっきりかけるよう …

no image

CSSのレイアウト例 その4 グリッドレイアウト

本日はグリッドレイアウトについて。 このサイトだけ見ても多分、デザインのイメージはわかないと思います(汗) サイトが具体的にどうなっているかを知りたい方は「プロとして恥ずかしくない 新・CSSデザイン …

no image

CSSのレイアウト例 その3 固定+リキッドレイアウト

本日は固定レイアウト+リキッドレイアウトについて。 リキッドレイアウトとはブラウザの幅に合わせて表示を変える方法でして、スマホが一般的となった現在では非常によく使われています。 今回解説するのは例えば …

no image

CSSのレイアウト例 その2 部分的な多カラムレイアウト

ナビのボタンや一覧のリスト項目などfloatを使ったいろいろなバリエーションについて。 例によってサイトが具体的にどうなっているかを知りたい方は「プロとして恥ずかしくない 新・CSSデザインの大原則」 …

no image

CSSのレイアウト例 その1 カラムレイアウト

本日はCSSのレイアウト例に関してよくあるものを見てみようと思います。 例によってサイトが具体的にどうなっているかを知りたい方は「プロとして恥ずかしくない 新・CSSデザインの大原則」を買いましょう。 …

no image

CSSでのtableについて

tableで気を付けたいポイントなど。 ボーダー表示 通常のtableのラインは二重線でちょっと気持ちが悪いです。通常はcollapseが一般的でしょう。 [crayon-5b4d1c395b2929 …