borderhandling-frame-border-ref.html (5266B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> 5 <style> 6 div {width: 3px; height: 3px;} 7 table.frame {border: outset thin ;} 8 table.frameTop {border-top: outset thin ;} 9 table.frameBottom {border-bottom: outset thin ;} 10 table.frameRight {border-right: outset thin ;} 11 table.frameLeft {border-left: outset thin ;} 12 13 td.inner {border: inset thin;} 14 15 </style> 16 </head> 17 <body> 18 <table cellpadding="5" rules="all"> 19 <tr><th>frame/border</th><th>empty</th><th>border</th><th>border="0"</th><th>border="1"</th><th>border="3"</th></tr> 20 <tr><th>empty</th> 21 <td><table><tr><td><div/></td></tr></table></td></td> 22 <td><table class="frame"><tr><td class="inner"><div/></td></tr></table></td></td> 23 <td><table><tr><td><div/></td></tr></table></td> 24 <td><table class="frame"><tr><td class="inner"><div/></td></tr></table></td> 25 <td><table class="frame" style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 26 </tr> 27 <tr><th>frame</th> 28 <td><table><tr><td><div/></td></tr></table></td> 29 <td><table><tr><td class="inner"><div/></td></tr></table></td></td> 30 <td><table><tr><td><div/></td></tr></table></td> 31 <td><table><tr><td class="inner"><div/></td></tr></table></td></td> 32 <td><table><tr><td class="inner"><div/></td></tr></table></td> 33 </tr> 34 <tr><th>frame="void"</th> 35 <td><table><tr><td><div/></td></tr></table></td> 36 <td><table><tr><td class="inner"><div/></td></tr></table></td></td> 37 <td><table><tr><td><div/></td></tr></table></td> 38 <td><table><tr><td class="inner"><div/></td></tr></table></td></td> 39 <td><table style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 40 </tr> 41 42 <tr><th>frame="above"</th> 43 <td><table class="frameTop"><tr><td><div/></td></tr></table></td> 44 <td><table class="frameTop"><tr><td class="inner"><div/></td></tr></table></td></td> 45 <td><table><tr><td><div/></td></tr></table></td> 46 <td><table class="frameTop"><tr><td class="inner"><div/></td></tr></table></td></td> 47 <td><table class="frameTop" style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 48 </tr> 49 50 <tr><th>frame="below"</th> 51 <td><table class="frameBottom"><tr><td><div/></td></tr></table></td> 52 <td><table class="frameBottom"><tr><td class="inner"><div/></td></tr></table></td></td> 53 <td><table><tr><td><div/></td></tr></table></td> 54 <td><table class="frameBottom"><tr><td class="inner"><div/></td></tr></table></td></td> 55 <td><table class="frameBottom" style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 56 </tr> 57 58 <tr><th>frame="hsides"</th> 59 <td><table class="frameTop frameBottom"><tr><td><div/></td></tr></table></td> 60 <td><table class="frameTop frameBottom"><tr><td class="inner"><div/></td></tr></table></td></td> 61 <td><table><tr><td><div/></td></tr></table></td> 62 <td><table class="frameTop frameBottom"><tr><td class="inner"><div/></td></tr></table></td></td> 63 <td><table class="frameTop frameBottom" style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 64 </tr> 65 66 <tr><th>frame="lhs"</th> 67 <td><table class="frameLeft"><tr><td><div/></td></tr></table></td> 68 <td><table class="frameLeft"><tr><td class="inner"><div/></td></tr></table></td></td> 69 <td><table><tr><td><div/></td></tr></table></td> 70 <td><table class="frameLeft"><tr><td class="inner"><div/></td></tr></table></td></td> 71 <td><table class="frameLeft" style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 72 </tr> 73 74 <tr><th>frame="rhs"</th> 75 <td><table class="frameRight"><tr><td><div/></td></tr></table></td> 76 <td><table class="frameRight"><tr><td class="inner"><div/></td></tr></table></td></td> 77 <td><table><tr><td><div/></td></tr></table></td> 78 <td><table class="frameRight"><tr><td class="inner"><div/></td></tr></table></td></td> 79 <td><table class="frameRight" style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 80 </tr> 81 82 <tr><th>frame="vsides"</th> 83 <td><table class="frameLeft frameRight"><tr><td><div/></td></tr></table></td> 84 <td><table class="frameLeft frameRight"><tr><td class="inner"><div/></td></tr></table></td></td> 85 <td><table><tr><td><div/></td></tr></table></td> 86 <td><table class="frameLeft frameRight"><tr><td class="inner"><div/></td></tr></table></td></td> 87 <td><table class="frameLeft frameRight" style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 88 </tr> 89 90 <tr><th>frame="box"</th> 91 <td><table class="frame"><tr><td><div/></td></tr></table></td> 92 <td><table class="frame"><tr><td class="inner"><div/></td></tr></table></td></td> 93 <td><table><tr><td><div/></td></tr></table></td> 94 <td><table class="frame"><tr><td class="inner"><div/></td></tr></table></td></td> 95 <td><table class="frame" style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 96 </tr> 97 98 <tr><th>frame="border"</th> 99 <td><table class="frame"><tr><td><div/></td></tr></table></td> 100 <td><table class="frame"><tr><td class="inner"><div/></td></tr></table></td></td> 101 <td><table><tr><td><div/></td></tr></table></td> 102 <td><table class="frame"><tr><td class="inner"><div/></td></tr></table></td></td> 103 <td><table class="frame" style="border-width: 3px"><tr><td class="inner"><div/></td></tr></table></td> 104 </tr> 105 </table> 106 107 </body> 108 </html>