横線を引くには <hr> を用います。hr は Horizontal Rule(水平罫線)の意味です。属性によって長さ、左右の位置、太さ、影の具合、色などを指定することができます。
<hr> <hr width=200 align=left> <hr width=200 size=5> <hr width=200 size=5 noshade> <hr width=200 size=5 color=red>
縦線を引くにはスタイルシートを用いて、下記のように実現します。
<div style="background-color:gray; width:2px; height:300px;"></div>
文字などを枠線で囲むには、<table> の border=1 属性を用いる方法もありますが、スタイルシートの border を用いる方法もあります。border: には線の太さ、線種、色を指定します。文字と枠線の間の余白は padding で調整します。
<div style="border:1px solid gray; padding:5px;"> あああああ </div>
斜めの線、曲線、折れ線グラフの線など、もっと自由な線を引くには、VML(Vector Markup Language)を用いる方法があります。詳細は「とほほのVML入門」を参照してください。
<html xmlns:v="urn:schemas-microsoft-com:vml"> <head> <title>VML TEST</title> <style> v\:* { behavior: url(#default#VML); } </style> </head> <body> <v:line from="0,100" to="300,100" strokecolor="black" /> <v:line from="0,100" to="0,0" strokecolor="black" /> </body> </html>