Warning: Undefined variable $i in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 142

Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
htmlのサイトを作ろう

htmlのサイトを作ろう

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


Warning: Undefined array key 1 in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/inc/scr/meta_info.php on line 92

Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
ページのレイアウトについて知ろう

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

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


Warning: Undefined array key 1 in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/inc/scr/meta_info.php on line 92

Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
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に%を使用するとそれはテーブル全体の横幅に対する割合にな...


Warning: Undefined array key 1 in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/inc/scr/meta_info.php on line 92

Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
border-collapseプロパティについて知ろう

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

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


Warning: Undefined array key 1 in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/inc/scr/meta_info.php on line 92

Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
cellspacing属性について知ろう

cellspacing属性について知ろう

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


Warning: Undefined array key 1 in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/inc/scr/meta_info.php on line 92

Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
テーブル内のボーダーを設定しよう

テーブル内のボーダーを設定しよう

この章ではテーブル内のボーダーの種類、色、幅を設定する方法について説明します。 では例をみてみましょう。 このCSSではth,td,tableタグのボーダーを設定しています。 結果は以下のようになります。


Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
セル内にvertical-alignの設定しよう

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

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


Warning: Undefined array key 1 in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/inc/scr/meta_info.php on line 92

Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
セル内にtext-alignの設定しよう

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

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


Warning: Undefined array key 1 in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/inc/scr/meta_info.php on line 92

Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
セル内でpaddingを設定しよう

セル内でpaddingを設定しよう

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


Warning: Undefined array key 1 in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/inc/scr/meta_info.php on line 92

Warning: Undefined array key "tweets_number_after_title_archive" in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/archive.php on line 155
テーブル(table)の中のセルを結合しよう(colspan,rowspan)

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

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


Warning: Undefined array key 1 in /home/a11926240/programminglanguage7.com/public_html/wp-content/themes/dp-elplano/inc/scr/meta_info.php on line 92
Return Top