もくじ

スタイルシートで整形練習(1)

課題 cellstyle1.html

ファイル名は cellstyle1.html 綴りに注意

もちろん、目次からのリンク、目次へ戻るリンクをつけてください。目次のリンクは「セルスタイル1」という文字列にすること。

一番下にあるhtmlページをタグごとコピーしてページを作ると次のような表ができます。

ページアドレスとリンク アクセス数 入口 出口 主な内容
/ 7438 6073 2363 トップページ
/bukatsu/bukatsu.html 1880 93 570 部活動の目次
/kouchou/kouchou.html 1458 21 215 校歌と歴史
/boshuu/yakyuu_tokutai.html 1181 24 501 野球部の特待生について
/shinro/shinro.html 812 11 73 卒業後の進路
/kouchou/history.html 794 6 131 聖愛の歴史1
/shinro/gendai.html 722 25 306 2012年度合格状況(2013年2月14日現在) 大学
/hibi/nd13/hibi1307.html 701 19 296 聖愛ジャーナル7月
まだ続きます。

これをスタイルシートで整形して次のような表に作りなさい。

目標の表

ヒント

htmlページ

<!DOCTYPE html>
<html>

<head> 
<meta charset="utf-8">
<title>セルスタイル1</title>
<style type="text/css">
table {
   margin: 1% 4% 1.5% 4%;
   border-collapse:collapse;
}
td {
   border:solid 1px #999999;
}
th {
   border:solid 1px #999999;
}
</style>
</head>

<body>
<p><a href="index.html">もくじ</a></p>
<h1>セルスタイル1</h1>
<h2>2013/7/23の聖愛ウェブページのページごとアクセス数</h2>
<p>/で終わっているアドレスは、index.htmlが省略されています。</p>
<p>入口とは他のサイトから聖愛に来た時に最初のページになった数</p>
<p>出口とはこのページを最後に聖愛から離れた(閲覧をやめた)数</p>
<table>
<tr>
<th>ページアドレスとリンク</th>
<th>アクセス数</th>
<th>入口</th>
<th>出口</th>
<th>主な内容</th>
</tr>
<tr>
<td>/</td>
<td>7438</td>
<td>6073</td>
<td>2363</td>
<td>トップページ</td>
</tr>
<tr>
<td>/bukatsu/bukatsu.html</td>
<td>1880</td>
<td>93</td>
<td>570</td>
<td>部活動の目次</td>
</tr>
<tr>
<td>/kouchou/kouchou.html</td>
<td>1458</td>
<td>21</td>
<td>215</td>
<td>校歌と歴史</td>
</tr>
<tr>
<td>/boshuu/yakyuu_tokutai.html</td>
<td>1181</td>
<td>24</td>
<td>501</td>
<td>野球部の特待生について</td>
</tr>
<tr>
<td>/shinro/shinro.html</td>
<td>812</td>
<td>11</td>
<td>73</td>
<td>卒業後の進路</td>
</tr>
<tr>
<td>/kouchou/history.html</td>
<td>794</td>
<td>6</td>
<td>131</td>
<td>聖愛の歴史1</td>
</tr>
<tr>
<td>/shinro/gendai.html</td>
<td>722</td>
<td>25</td>
<td>306</td>
<td>2012年度合格状況(2013年2月14日現在) 大学</td>
</tr>
<tr>
<td>/hibi/nd13/hibi1307.html</td>
<td>701</td>
<td>19</td>
<td>296</td>
<td>聖愛ジャーナル7月</td>
</tr>
<tr>
<td>/bukatsu/senseki/senseki.html</td>
<td>621</td>
<td>12</td>
<td>161</td>
<td>聖愛の活躍 2013</td>
</tr>
<tr>
<td>/bukatsu/undoub/base/base.html</td>
<td>619</td>
<td>5</td>
<td>217</td>
<td>野球部</td>
</tr>
<tr>
<td>/qanda/qandau8.html</td>
<td>452</td>
<td>215</td>
<td>258</td>
<td>質問のページ</td>
</tr>
<tr>
<td>/jimu/bus.html</td>
<td>446</td>
<td>9</td>
<td>75</td>
<td>聖愛への交通手段(2008年のバス)</td>
</tr>
<tr>
<td>/qanda/messagenospamu8.html</td>
<td>433</td>
<td>11</td>
<td>142</td>
<td>卒業生からのメッセージ</td>
</tr>
<tr>
<td>/boshuu/</td>
<td>406</td>
<td>8</td>
<td>101</td>
<td>高等学校入学案内 </td>
</tr>
<tr>
<td>/chapel/chapel.html</td>
<td>335</td>
<td>8</td>
<td>51</td>
<td>礼拝</td>
</tr>
<tr>
<td>/kouchou/history3.html</td>
<td>324</td>
<td>15</td>
<td>170</td>
<td>聖愛の歴史3</td>
</tr>
<tr>
<td>/sys/text/java/shiftjis_table.html</td>
<td>316</td>
<td>290</td>
<td>278</td>
<td>情報教材javaからShift_JISコード表</td>
</tr>
<tr>
<td>/kouchou/history2.html</td>
<td>288</td>
<td>4</td>
<td>10</td>
<td>聖愛の歴史2</td>
</tr>
<tr>
<td>/kouchou/kouka.html</td>
<td>280</td>
<td>44</td>
<td>83</td>
<td>校歌</td>
</tr>
<tr>
<td>/yui/</td>
<td>273</td>
<td>11</td>
<td>39</td>
<td>同窓の結い</td>
</tr>
<tr>
<td>/topics/topics.html</td>
<td>253</td>
<td>5</td>
<td>38</td>
<td>トピック・イベント</td>
</tr>
<tr>
<td>/ajnhs/</td>
<td>212</td>
<td>8</td>
<td>8</td>
<td>中学校入学案内 </td>
</tr>
<tr>
<td>/jimu/map.html</td>
<td>206</td>
<td>4</td>
<td>91</td>
<td>聖愛周辺図</td>
</tr>
<tr>
<td>/jimu/saiyou14/</td>
<td>180</td>
<td>3</td>
<td>19</td>
<td>教員募集</td>
</tr>
<tr>
<td>/shinro/sakudai.html</td>
<td>176</td>
<td>1</td>
<td>73</td>
<td>2011年度合格状況</td>
</tr>
<tr>
<td>/ajnhs/senior/</td>
<td>173</td>
<td>61</td>
<td>47</td>
<td>弘前聖愛リトルシニア</td>
</tr>
<tr>
<td>/kouchou/images/seiaikouka.mid</td>
<td>163</td>
<td>1</td>
<td>16</td>
<td>校歌(曲)</td>
</tr>
<tr>
<td>/ajnhs/annai/boyoukou.html</td>
<td>163</td>
<td>10</td>
<td>49</td>
<td>中学校募集要項</td>
</tr>
<tr>
<td>/bukatsu/undoub/base/base-game.html</td>
<td>155</td>
<td> </td>
<td>25</td>
<td>野球部(試合の様子)</td>
</tr>
<tr>
<td>/sys/text/java/utf8table.html</td>
<td>152</td>
<td>122</td>
<td>119</td>
<td>情報教材javaからUTF-8コード表</td>
</tr>
<tr>
<td>/bukatsu/undoub/base/base-katu.html</td>
<td>148</td>
<td> </td>
<td>60</td>
<td>野球部(日頃の活動)</td>
</tr>
<tr>
<td>/yui/kakosotu.html</td>
<td>132</td>
<td> </td>
<td>9</td>
<td>同窓の結の中の「活躍する卒業生」</td>
</tr>
<tr>
<td>/kakomon/kakomon.html</td>
<td>129</td>
<td>5</td>
<td>26</td>
<td>入試過去問</td>
</tr>
<tr>
<td>/shinro/sakushuu.html</td>
<td>108</td>
<td>6</td>
<td>47</td>
<td>就職先(11年度卒業生)一覧</td>
</tr>
<tr>
<td>/jimu/saiyou14/saiyou14.html</td>
<td>107</td>
<td> </td>
<td>43</td>
<td>教員採用募集要項</td>
</tr>
<tr>
<td>/yui/kakokyou.html</td>
<td>100</td>
<td> </td>
<td>3</td>
<td>同窓の結の中の「先生方からのメッセージ」</td>
</tr>
<tr>
<td>/kouchou/images/seiaikouka0.mid</td>
<td>99</td>
<td>4</td>
<td>13</td>
<td>聖愛校歌(曲)</td>
</tr>
<tr>
<td>/ajnhs/senior/senseki.html</td>
<td>93</td>
<td>3</td>
<td>39</td>
<td>弘前聖愛リトルシニア⇒主な戦績 </td>
</tr>
<tr>
<td>/yui/kakoyo.html</td>
<td>87</td>
<td> </td>
<td>11</td>
<td>同窓の結の中の「学校の様子」</td>
</tr>
<tr>
<td>/bukatsu/bekkyoku/spg/spg.html</td>
<td>84</td>
<td>24</td>
<td>31</td>
<td>部活動 SPG</td>
</tr>
<tr>
<td>/shinro/gensen.html</td>
<td>80</td>
<td> </td>
<td>24</td>
<td>2012年度合格状況(2013年2月14日現在)  各種専修学校</td>
</tr>
<tr>
<td>/kouchou/moto.html</td>
<td>77</td>
<td>1</td>
<td>16</td>
<td>元大工町校舎の写真</td>
</tr>
<tr>
<td>/chapel/service.html</td>
<td>77</td>
<td> </td>
<td>18</td>
<td>聖愛にとって礼拝とは</td>
</tr>
<tr>
<td>/shinro/gentan.html</td>
<td>73</td>
<td> </td>
<td>8</td>
<td>2012年度合格状況(2013年2月14日現在) 短期大学</td>
</tr>
<tr>
<td>/chapel/service-latest.html</td>
<td>71</td>
<td> </td>
<td>13</td>
<td>礼拝 最近のお話</td>
</tr>
</table>
</body>
</html>