<html lang="ja"> <head> <meta http-equiv="content-type" charset="UTF-8"> <style type="text/css"> body { cursor: pointer; } </style> </head> <body> <font size="6">このページはカーソルの形が変わります。</font> </body> </html> |
default | |
pointer | |
crosshair | |
move | |
text |
背景色を変える |
<style type="text/css"> body { background: 色のスペルやコード; } </style> |
背景に画像を表示する。 |
<style type="text/css"> body { background-image: url(画像のファイル名); } </style> |
背景色をグラデーション表示する |
<style type="text/css"> body { background: linear-gradient(方向, 色①, 色②); } </style> ※「方向」にはグラデーションさせる向きのスペルを入力してください to bottom:上から下 to top:下から上 to right:左から右 to left:右から左 ※「色①」「色②」には表示したい色のスペルやコードを入力してください |
カーソルを変更する |
<style type="text/css"> body { cusrsor: カーソルの形; } </style> ※「カーソルの形」には表示させたい形に対応した単語を入力してください。 default: pointer: crosshair: move: text: |
クリックする前のリンクの色を変える |
<style type="text/css"> a:link { color: 色①; background-color: 色②; } </style> ※「色①」にはリンクの文字の色のスペルやコードを入力してください ※「色②」にはリンクの背景の色のスペルやコードを入力してください |
クリック済みのリンクの色を変える |
<style type="text/css"> a:visited { color: 色①; background-color: 色②; } </style> ※「色①」にはリンクの文字の色のスペルやコードを入力してください ※「色②」にはリンクの背景の色のスペルやコードを入力してください |
マウスカーソルを乗せた時のリンクの色を変える |
<style type="text/css"> a:hover { color: 色①; background-color: 色②; } </style> ※「色①」にはリンクの文字の色のスペルやコードを入力してください ※「色②」にはリンクの背景の色のスペルやコードを入力してください |
文字を大きくする | <font size="6">文字の大きさ</font> | ||||
文字の色を変える |
<font color="red">文字の色</font> ※色のスペル一覧 red blue green yellow pink purple brown black white ……等々 |
||||
画像を貼りつける |
<img src="gazou.jpg">
※横幅を変更したい場合 <img src="gazou.jpg" width="100"> ※高さを変更したい場合 <img src="gazou.jpg" height="100"> |
||||
リンクを貼りつける | <a href="lesson.html">リンク</a> | ||||
文字を中央に寄せる | <center>中央寄せ</center> | ||||
改行する |
改行 <br> 改行 |
||||
表を作成する |
<table border="1"> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </table> 例
|
||||
セルを結合する (水平方向) |
<table border="1"> <tr> <td colspan="2">1</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </table> 例
|
||||
セルを結合する (垂直方向) |
<table border="1"> <tr> <td rowspan="2">1</td> <td>2</td> </tr> <tr> <td>4</td> </tr> </table> 例
|