skillup

技術ブログ

「 デザイン 」 一覧

no image

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

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

no image

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

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

no image

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

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

no image

CSSでのtableについて

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

no image

CSS positionについて

本日はpositionについて。 要素を通常、配置される場所から別の場所に配置させたいような場合positionを使います。 positionの使い方 相対配置 relative 相対配置は通常表示さ …

no image

CSS floatについて

以前もちょっと書きましたが、CSSのfloatについて。 http://skill-up-engineering.com/?p=1708への追記 親から見るとfloatした子供は存在しない状態 flo …

no image

フォーム入力のポイント

2016/08/29   -デザイン

以前のエントリーにならってさらにフォーム入力のデザイン上のポイントなどを。 選択肢は横よりも縦で ラジオやチェックボックスなどで大量の選択肢を並べる場合、人間の視認性は横よりも縦のほうが勝るため、左右 …

no image

デザイ二ングインターフェイスのまとめ

2016/08/25   -UI, デザイン
 

デザイ二ングインターフェイスを今まで読んで実務にすぐ生かせそうな&ポイントとなりそうな箇所のまとめ ユーザーを理解する ユーザーが何をしたいか ・・・ 根本的な目的 ソフトウェアがなければどのように処 …

no image

CSSはまりやすいポイント ※随時更新予定

CSSにてよく確認するのネタに関して 中央寄せ vertical-alignを指定できるのは「インライン要素」と「テーブルセル」だけ text-align:centerはインラインのみ。 margin …

no image

CSSのブロックとインライン、レイアウトについて

今回はCSSを組む時のブロックレベルとインラインの基本とレイアウトに関して。 ブロックレベルとインライン ブロックレベル要素 その名のとおり、HTML上でブロックを構成する要素。div,p,table …