| 
						
					 | 
				
				
					| 
						
					 | 
				
				
					
						
							
								1. cssを使わず、tableで単に border="1" bordercolor="#aa9ef8"と指定。 
									これだと枠線がcss指定の3px程度に太ってしまう。
								
									
										
											 iモード(DoCoMo)  
									 | 
									
										
											 WILLCOM  
									 | 
								 
								
									
										
											 EZweb(KDDI)  
									 | 
									
										
											 Yahoo Mobile  
									 | 
								 
								
									
										
											 Yahoo!ケータイ(旧Vodafon live!)  
									 | 
								 
							 
							
							
								2. 上の状態から、table指定を外し、各セルに cssで色と「細い線=thin」を指定してみる: 
									bordercolor="#aa9ef8" style="border-width: thin;" を追加。 しかし枠線の重なり合うところが太くなってしまう。 (しかもSafari以外ではどうも枠線が表示されない模様)
								
									
										
											 iモード(DoCoMo)  
									 | 
									
										
											 WILLCOM  
									 | 
								 
								
									
										
											 EZweb(KDDI)  
									 | 
									
										
											 Yahoo Mobile  
									 | 
								 
								
									
										
											 Yahoo!ケータイ(旧Vodafon live!)  
									 | 
								 
							 
							
							
								3. cssで、各セルに枠線の指定を付ける。 
									border:1px solid #bbaaff; 上と同じく、枠線の重なり合うところが太くなってしまう。
								
									
										
											 iモード(DoCoMo)  
									 | 
									
										
											 WILLCOM  
									 | 
								 
								
									
										
											 EZweb(KDDI)  
									 | 
									
										
											 Yahoo Mobile  
									 | 
								 
								
									
										
											 Yahoo!ケータイ(旧Vodafon live!)  
									 | 
								 
							 
							
							
								4. 枠線の重なりを防ぐため、 3種類のcssを使い分ける。 class="kei01" class="kei02" class="kei03"を使用。 .kei02 {border-top:1px solid #bbaaff; border-right:1px solid #bbaaff; border-left:1px solid #bbaaff; }など。 セル数が多くなるとちょっと面倒。
								
									
										
											 iモード(DoCoMo)  
									 | 
									
										
											 WILLCOM  
									 | 
								 
								
									
										
											 EZweb(KDDI)  
									 | 
									
										
											 Yahoo Mobile  
									 | 
								 
								
									
										
											 Yahoo!ケータイ(旧Vodafon live!)  
									 | 
								 
							 
							 
						 
						
					 | 
					
						
							
								5. また、tableにborder="" bordercolor=""の 指定だけだと、 Firefoxでは、cssのridgeの 指定をしたときのようになってしまう。 tableにborder="3" bordercolor="#aa9ef8"
								
									| 
										 代引金額 
									 | 
									
										  代引手数料(税込) 
									 | 
								 
								
									| 
										 1万円まで 
									 | 
									
										 315円 
									 | 
								 
								
									| 
										 3万円まで 
									 | 
									
										 420円 
									 | 
								 
								
									| 
										 10万円まで 
									 | 
									
										 630円 
									 | 
								 
								
									| 
										 30万円まで 
									 | 
									
										 1,050円 
									 | 
								 
								
									| 
										 50万円まで 
									 | 
									
										 2,100円 
									 | 
								 
								
									| 
										 100万円まで 
									 | 
									
										 3,150円 
									 | 
								 
								
									| 
										 100万円を超える場合 
									 | 
									
										 4,200円 
									 | 
								 
							 
							
							
								6. 上と同じtableで、cssを使わず、 「4.」のような枠線を作る。 tableのbgに色を付け、各セルのbgを白に。 border="0" cellspacing="1" cellpadding="0" bgcolor="#bbaaff"。各セルでbgcolor="#ffffff"。
								
									| 
										 代引金額 
									 | 
									
										  代引手数料(税込) 
									 | 
								 
								
									| 
										 1万円まで 
									 | 
									
										 315円 
									 | 
								 
								
									| 
										 3万円まで 
									 | 
									
										 420円 
									 | 
								 
								
									| 
										 10万円まで 
									 | 
									
										 630円 
									 | 
								 
								
									| 
										 30万円まで 
									 | 
									
										 1,050円 
									 | 
								 
								
									| 
										 50万円まで 
									 | 
									
										 2,100円 
									 | 
								 
								
									| 
										 100万円まで 
									 | 
									
										 3,150円 
									 | 
								 
								
									| 
										 100万円を超える場合 
									 | 
									
										 4,200円 
									 | 
								 
							 
							cssの利用が推奨されるところですが、 作業自体はこちらの方が楽。 
							
							
							
						 
					 | 
				
				
					| 
						 
							    
					 | 
				
				
					
						
							●borderのその他の主なスタイル指定
							
								css  class="kei51" を使用。border:3px double #bbaaff
								
									
										
											 Yahoo!ケータイ(旧Vodafon live!)  
									 | 
								 
							 
							
							
								css  class="kei52" を使用。border:3px groove #bbaaff
								
									
										
											 Yahoo!ケータイ(旧Vodafon live!)  
									 | 
								 
							 
							
							
								css  class="kei53" を使用。border:3px ridge #bbaaff
								
									
										
											 Yahoo!ケータイ(旧Vodafon live!)  
									 | 
								 
							 
							
							
								css  class="kei54" を使用。border:3px inset #bbaaff
								
									
										
											 Yahoo!ケータイ(旧Vodafon live!)  
									 | 
								 
							 
							
							
								css  class="kei55" を使用。border:3px outset #bbaaff
								
									
										
											 Yahoo!ケータイ(旧Vodafon live!)  
									 | 
								 
							 
							
							
						 
					 | 
					
						
						 → htmlで、細くてきれいな枠線の表組を作る(2) |