skillup

技術ブログ

デザイン

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

投稿日:2016年7月23日 更新日:

CSSにてよく確認するのネタに関して

中央寄せ

  • vertical-alignを指定できるのは「インライン要素」と「テーブルセル」だけ
  • text-align:centerはインラインのみ。
  • margin:autoは高さ、幅を指定しないと効かない
  • 対象がブロックレベルかインラインかで全く違ってくる

【CSS】要素を上下左右に中央寄せする色々な方法

命名

もう、class名やid名で悩まないんだからっ!!

テーブル

  • 意図した幅にならない場合は自動調整が働いている。table-layout:fixed;を設定。

CSSでtable幅を設定するためのまとめ

-デザイン
-, ,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

cakePHP+bootstrapでのページャー

cakePHP+bootstrapでページャーのリンクを下記のように出力したいときのメモを。 ソース コントローラーのほうでは特に設定する必要なはく、HTMLのほうで下記のように設定すればOKです。 …

no image

data- HTML5のカスタムデータについて

HTML5のカスタムデータ属性について。 HTML5ではタグにdata-*とすることで任意の値を持たせることができます。 いまさら聞けない、HTML5カスタムデータ属性の基本と使いどころ 例として下記 …

no image

テンプレートエンジンTwigについて

SmartyにかわるテンプレートエンジンとしてTwig(ツィッグ)を勉強中。 といってもテンプレートエンジンなので基本的なことはほとんど一緒っぽいですが。 Contents1 インストール2 基本的な …

no image

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

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

no image

キャッチ画像の扱いについて

今さらながらですが、サイトのトップなどに貼り付けるメインビジュアル系の画像の処置について。 スマホサイトオンリーだとあまり考えなくてもいいかもしれませんが、PCやレスポンシブの場合、ブラウザの幅が伸縮 …