HTML
■colspan属性:横方向にマスを連結する場合に使用する。 ■rowspan属性:縦方向にマスを連結する場合に使用する。 ■colspan属性、rowspan属性はともにtd要素の属性であることに注意する。 <html> <head> <meta charset="UTF-8"> </head> <body> <h2>colspanとrowspan</h2> <table border="1"> <tr> <td>1</td> <td colspan="2">2</td> </tr> <tr> <td>3</td> <td rowspan="2">4</td>…</tr></table></body></html>
■表の全体を table border="1" 要素で表現。枠の太さはborder属性で指定する ■各行(横方向)を tr で表現する ■行の中の個々の要素を td で表現し、その中に表示する内容(文字や図)を配置する。 > <html> <head> <meta charset="UTF-8"> </head> <body> <h2>今日の試合</h2> <table border="1"> <tr> <td></td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>計</td> </tr> <tr> …</tr></table></body></html>
■箇条書き:ul ■番号付リスト:ol ■リストの項目:li <html> <head> <meta charset="UTF-8"> </head> <body> <h2>ジャーマンポテト</h2> <h3>材料</h3> <ul> <li>ジャガイモ 2個</li> <li>玉ねぎ 1個</li> <li>ベーコン 200g</li> </ul> <h3>作り方</h3> <ol> <li>ジャガイモと玉ねぎを薄切りにします</li> <li>ベーコン、ジャガイモ、玉ねぎの順で炒めます</li> <li>塩コショウで味を調えます</li> </ol> </body></html>
HTML5 ひな形 ■主なタグの使用方法 HTML 主な要素一覧表 HTML 見出しと段落に使用する要素(h1,h2,h3,p,span) HTML テーブルに使用する要素①(table,tr,td)HTML テーブルに使用する要素② (colspan,rowspan) HTML 箇条書きに使用する要素 - ray88’s diary ■他フ…
■ h1、h2、h3:見出しタグ ■ p:段落タグ ■ span:文章の一部に特別の意味を与えるタグ (CSSを使用してその部分だけ表示をかえるなど) <html> <head> <meta charset="UTF-8"> </head> <body> <h1>これは見出し1です。</h1> <h2>これは見出し2です。</h2> <h3>これは見出し3です。</h3> <p> これは段落です。上下に空白が挿入され、ま</p></body></html>…
要素名 元になった英語 用途 h1 heading1 見出し1 h2 heading1 見出し2 p paragraph 段落 div document division グループ化 span span テキストの一部 ul unordered list 箇条書き ol ordered list 番号付リスト li list item リストの項目 img image 画像…
■HTML5のひな形文(ファイルはUTF-8形式・拡張子はhtmlで作成) <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> </html> ※基本的なフォルダ階層はこんな感じ