タグ

ブックマーク / web.w3g.jp (5)

  • word-breakとword-wrapはややこしい

    Updated 2015.01.13 / Published 2015.01.13 word-break:break-all;は一切の禁則処理を解除し、どの文字の間でも改行するため、単語の途中や括弧の直前・直後で折り返したり、句読点が行頭にきてしまうことなどがあることから折り返しの制御には好ましくないとされています。望ましい折り返しの制御をしてくれるword-wrap:break-word;(overflow-wrap:break-word;)の用法について紹介します。 折り返しを制御する2つのCSSプロパティ 幅の狭い領域で長い英単語や長いURLの途中で折り返しを制御できるCSSプロパティは、特にスマートフォンなどの小さなディスプレイサイズ向けへの対応を考慮してよく用いられるようになってきています。ただし、CSS3には折り返しを制御できるCSSプロパティが2つ存在し、とてもややこしいので

    word-breakとword-wrapはややこしい
  • background

    Updated 2013.10.27 / Published 2007.02.02 backgroundプロパティは background-colorプロパティ, background-imageプロパティ, background-repeatプロパティ, background-attachmentプロパティ, background-positionプロパティの背景色・背景画像などの背景に関する5つのプロパティをまとめて設定するショートハンド(CSSにおいて値を簡略化できる記法のこと)です。 値 <background-color> <background-image> <background-repeat> <background-attachment> <background-position> inherit 初期値 background-color : transparent ;

    background
  • HTML5についてのおさらい|Web制作 W3G

    Updated 2010.07.29 / Published 2010.07.29 これからHTML5を使いはじめようという方に向けたHTML5のおさらいです。HTML5の記述方法にはじまり、導入にあたって間違いやすいところや勘違いしがちなところをまとめてあります。 hgroup, header, footer要素の説明を含めた続きもあります(続HTML5についてのおさらい)。 HTML5の記述方法 まず最初に、必ずDOCTYPE宣言を行います。HTML5には公式のDTDがないので、すごくシンプルになっています。 <!DOCTYPE html> 続いて、html要素にドキュメントの言語を宣言します。 <html lang="ja"> そして順番にhead要素ときて、文字エンコーディングの指定ですが、charset属性が新たに利用できるようになりました。 <meta charset="UTF

    HTML5についてのおさらい|Web制作 W3G
  • position

    Updated 2013.11.06 / Published 2007.02.02 positionプロパティは要素の配置方式を指定し、topプロパティ, bottomプロパティ, leftプロパティ, rightプロパティによって配置する位置を指定します。 非視覚環境での観覧者に配慮したメニューを読み飛ばすリンクなど、positionプロパティはアクセシビリティを高めるためのテクニックにも応用されています。また、CSS2 において、適用対象から除外されていた生成内容の要素についても、改訂版 CSS2.1 では指定が可能となっています。ただし、ルート部の要素(html要素と body要素)に対する指定は無効です。 値 static relative absolute fixed 初期値 static 適用対象 すべての要素 継承 しない メディア visual positionプロパティの

    position
  • CSS によるブロックレベル要素の左右中央揃え

    Updated 2006.04.21 / Published 2006.04.21 Internet Explorer6のシェアが全盛期だったころ、初心者が CSS を使ったデザインでつまづく(失敗する)ことが多い事例に text-alignプロパティの誤用がありました。文書では、CSS デザインによる論理構造と表現(見栄え)とを分離させる一歩として div要素の align属性や center要素を使った (X)HTMLでの表示指定に頼らないCSS による代替のみでブロックレベル要素(display:block;の状態の要素)の左右中央揃えをコントロールする手法を解説します。 text-alignプロパティの誤用に注意 div要素の align属性や center要素とは異なり、text-alignプロパティによる指定では横幅の指定されたブロックレベル要素(display:block;

    CSS によるブロックレベル要素の左右中央揃え
  • 1