4本の線のテイストを変えるその1

楽天ブログ＆アフィリエイトで使えるＨＴＭＬ小技集
TABLEタグでもっと自由にレイアウト

●4本の線のテイストをバラバラに変える　その1

ここでご紹介するのは長いHTMLを書く方法です
線を変えてテーブルレイアウトを多様にする方法は前回紹介した方法
1.線種と太さをかえる
2.テーブルの四辺の1辺だけを表示する
で実際のところ十分かと思われますので、このページは読み飛ばしてくださっても問題ないと思います
さらに突っ込んでお勉強したいという方はどうぞご利用ください

● 四辺それぞれの線種を変える

border-style	：	solid	dotted	double	dashed	；
		上辺	左辺	下辺	右辺
時計周りに指定します

さらに
border-top-style: solid;　で上辺の線種を
border-bottom-style: solid;　で下辺の線種を
border-left-style: solid;　で左辺の線種を
border-right-style: solid;　で右辺の線種を
それぞれ指定できます

● 四辺それぞれの色を変える

border-color	：	#e6001a	#ff8700	#669933	#1a6680	；
		上辺	左辺	下辺	右辺
こちらも時計周りに指定します

さらに
border-top-color: #666666;　で上辺の色を
border-bottom-color: #666666;　で下辺の色を
border-left-color: #666666;　で左辺の色を
border-right-color: #666666;　で右辺の色を
それぞれ指定できます

もうお分かりですね！
これらを組み合わせると4本の線のテイストをバラバラに表示することができるんです

……ページが長くなりますので、2ページに分けることにいたします
続きは次ページへ

次ページへ進む　4本の線のテイストをバラバラに変える　その2

前ページへ戻る　四辺の1辺だけを表示する

楽天ブログ＆アフィリエイトで使えるＨＴＭＬ小技集ＴＯＰへ