dポイントプレゼントキャンペーン実施中！

CSSで任意の位置から縦罫線、横罫線を引きたい

解決済

  • 質問者：htgo
  • 質問日時：
  • 回答数：3件

　お早う御座います、CSSの初心者です宜しくお願い致します。

　CSSで任意の位置から縦罫線、横罫線をそれぞれ単独の線として引くのはどの様に書けば良いのですか。
　以上宜しくお願い致します。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (3件)

No.2ベストアンサー

  • 回答者： outbrave
  • 回答日時：

テーブルレイアウトでしたら、好きな位置に文字を書く事ができます。

(普通のテーブルですから当然ですが）

table の中に文字を書き、css で必要ない枠線を表示させない感じです。（実際は必要な枠線を、border で表示させます）

複雑な表になるようでしたら、ペイントソフトで作成して、画像ファイルを表示させるのがよいと思います。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<title></title>

</head>

<body>

<table cellpadding="0" cellspacing="0">
<tr>
<td style="border-right:solid 2px #C0C0C0;width:150px;height:50px">&shy;</td>
<td style="width:150px">&shy;</td>
</tr>
</table>

<table cellpadding="0" cellspacing="0">
<tr>
<td style="border:solid 2px #C0C0C0;border-bottom:solid 2px #C0C0C0;width:300px;height:50px;text-align:center">部長</td>
</tr>
</table>

<table cellpadding="0" cellspacing="0">
<tr>
<td style="border-right:solid 2px #C0C0C0;width:150px;height:50px">&shy;</td>
<td style="width:150px">&shy;</td>
</tr>
</table>

<table cellpadding="0" cellspacing="0">
<tr>
<td style="width:50px;height:50px">&shy;</td>
<td style="border:solid 2px #C0C0C0;border-bottom:none;width:200px">&shy;</td>
<td style="width:50px">&shy;</td>
</tr>
</table>

<table cellpadding="0" cellspacing="0">
<tr>
<td style="border:solid 2px #C0C0C0;width:100px;height:50px;text-align:center">課長</td>
<td style="width:100px">&shy;</td>
<td style="border:solid 2px #C0C0C0;width:100px;text-align:center">課長</td>
</tr>
</table>

</body>

</html>
    • good
    • 1
    • 件
通報する
この回答へのお礼

outbraveさん、有り難う御座いました。
今後とも宜しくお願いします。

通報する
お礼日時：2007/10/15 00:28

No.3

  • 回答者： k0021
  • 回答日時：

下記URLで質問しましたが


縦罫線、横罫線は、文字一覧の罫線を使用しています
ただしフォント指定が必要です
font:17px/16px serif;
行間隔と等幅ホントを指定して下さい
横罫線は、思うどうり表示」出来ないかもおもいますが　？？
IEのみ対応の場合は、記述どうりに表示しますがMACでは対応しません
CSSの初心者の場合MACでの対応の場合は、画像ファイルの表示が無難と思います

参考URL：http://oshiete1.goo.ne.jp/qa3419105.html
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： outbrave
  • 回答日時：

table でレイアウトを決めてから、border で表示させればよいかと。



例：
<td style="border-bottom: solid 1px #FF9900">
    • good
    • 0
    • 件
通報する
この回答へのお礼

outbraveさん有り難う御座います。
組織図みたいなものを描きたいのですが、罫線の左右、下側にも自由に文字は書けるのでしょうか。
宜しくお願いします。

通報する
お礼日時：2007/10/14 22:38

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報