Warning: count(): Parameter must be an array or an object that implements Countable in /home/a11926240/programminglanguage7.com/public_html/wp-content/plugins/wordpress-ping-optimizer/cbnet-ping-optimizer.php on line 533
htmlのサイトを作ろう

htmlのサイトを作ろう

この章ではまとめとしてHTMLのサイトを作ります。 結果は以下の通りです。 では初めにメニューの作り方について説明します。 メニューはリストで作成するのでulとliで作成します。 ulとli にCSSを施さないと以下の状態です。 ここではマークは必要ないので、list-style-typeプロパティの値をnoneに指定...

ページのレイアウトについて知ろう

ページのレイアウトについて知ろう

この章ではページのレイアウトについて説明します。 最初に何もレイアウトを施していない例を書きます。 結果は以下のようになります。 HTML文書の中にと言うタグがありますが、divタグはそれ自体は特に意味を持っていませんが、で囲んだ部分をブロックとみなして、CSSを適用するために使います。 この例では複数の箇所でdivタ...

thとtdにwidthとheightを設定しよう

thとtdにwidthとheightを設定しよう

この章ではthとtdにwidthを設定する方法について説明します。 今まではtable要素にwidthを指定していましたが、widthは td や thにも設定できます。 widthに入力できる値はpx,pt,pc,ex,em,mm,cm,inや%です。th,tdに%を使用するとそれはテーブル全体の横幅に対する割合にな...

border-collapseプロパティについて知ろう

border-collapseプロパティについて知ろう

この章では隣り合うセルのボーダーを重ねたり、離して表示するborder-collapseについて説明します。 では例をみてみましょう。 table要素のCSSにを指定すると隣接するセルのボーダーを重ねて表示します。 上の例は隣り合うセルを重ねていますが、重なり合う箇所はの中でいずれかの設定された「幅、スタイル、色」が優...

cellspacing属性について知ろう

cellspacing属性について知ろう

この章ではcellspacing属性について説明します。 cellspacing属性はセル同士の間隔を指定する属性です。 では例をみてみましょう。 セル同士の間隔を設定するためにはtable要素の属性にcellspacingを指定します。 値に”0″を指定するとセル間の間隔は無くなりますが、以下...

セル内にvertical-alignの設定しよう

セル内にvertical-alignの設定しよう

この章ではテーブルのセル内の文字の縦方向の位置を指定するvertical-alignについて説明します。 vertical-alignはすでに学習済みですが、復習してみましょう。 vertical-alignでは行内のテキストの縦方向の位置を指定できます。 セルの場合は以下の3種類の値を使用します。 では例をみてみまし...

セル内にtext-alignの設定しよう

セル内にtext-alignの設定しよう

この章ではセルのCSSにtext-alignプロパティを追加してみましょう。 text-alignプロパティは「ブロック要素の中の文字や画像」や「セルの中のインライン要素である文字や画像」を指定した位置に行揃え(水平方向)します。では例をみてみましょう。 結果は以下のようになります。 CSSのthとtdにを設定したこと...

セル内でpaddingを設定しよう

セル内でpaddingを設定しよう

この章ではセル内でのpaddingの設定方法について説明します。 paddingはpx,pt,pc,mm,cm,%などの数値で書きます。 では例をみてみましょう。 上の印を付けた箇所がpaddingですが、thとtdに対してpaddingを設定しています。もちろん、印を付けた箇所以外のthとtdにもpaddingが設定...

テーブル(table)の中のセルを結合しよう(colspan,rowspan)

テーブル(table)の中のセルを結合しよう(colspan,rowspan)

この章ではテーブルの中のセルを結合する方法を説明します。 横方向のセルを結合するのか、縦方向のセルを結合するのかで書き方が違います。 =>横方向のセルを結合します。 ダブルクォートの中には結合したいセルの横方向のセルの数を指定します。 例えば横方向の3つのセルを結合したい場合はと書きます。 =>縦方向のセル...

Return Top