{"id":6252,"date":"2023-11-24T19:40:53","date_gmt":"2023-11-24T10:40:53","guid":{"rendered":"https:\/\/techmania.jp\/blog\/?p=6252"},"modified":"2023-12-15T17:22:05","modified_gmt":"2023-12-15T08:22:05","slug":"html-table","status":"publish","type":"post","link":"https:\/\/techmania.jp\/blog\/html-table\/","title":{"rendered":"\u3010HTML\u3011\u8868\u306e\u4f5c\u6210\u65b9\u6cd5\u3092\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c9\u3067\u89e3\u8aac"},"content":{"rendered":"

HTML\u3067\u8868\u3092\u4f5c\u6210\u3059\u308b\u306b\u306ftable\u30bf\u30b0\u3092\u4f7f\u3044\u307e\u3059\u3002\u57fa\u672c\u7684\u306a\u4f7f\u3044\u65b9\u304b\u3089<\/span><\/span>\u30c6\u30fc\u30d6\u30eb\u306e\u88c5\u98fe\u3001\u30bb\u30eb\u3084\u6587\u5b57\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u307e\u3067\u8aac\u660e\u3057\u307e\u3059\u3002<\/span><\/span><\/p>\n

\u3010\u4f5c\u6210\u3059\u308b\u8868\u3011<\/strong><\/p>\n\n\n

\u540d\u524d<\/strong><\/td>\u70b9\u6570<\/strong><\/td><\/tr>
\u7530\u4e2d<\/td>100<\/td><\/tr>
\u5c71\u7530<\/td>80<\/td><\/tr>
\u4f50\u85e4<\/td>90<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n

HTML\u3067\u8868\u3092\u69cb\u6210\u3059\u308b4\u3064\u306e\u8981\u7d20<\/h2>\n\n\n

HTML\u306e\u8868\uff08\u30c6\u30fc\u30d6\u30eb\uff09\u306ftable\u30fbtr\u30fbtd\u30fbth\u3068\u3044\u30464\u3064\u306e\u300c\u8981\u7d20\u300d\u3067\u69cb\u6210\u3055\u308c\u307e\u3059\u3002\u8981\u7d20\u306f\u3001\u958b\u59cb\u30bf\u30b0\uff08<\uff09\u3001\u5185\u5bb9\u3001\u7d42\u4e86\u30bf\u30b0\uff08>\uff09\u306e3\u3064\u3067\u69cb\u6210\u3055\u308c\u307e\u3059\u3002<\u3068>\u3067\u56f2\u307e\u308c\u305f\u3082\u306e\u3092\u300c\u30bf\u30b0\u300d\u3068\u3044\u3044\u3001HTML\u3067\u8868\u3092\u4f5c\u6210\u3059\u308b\u5834\u5408\u3001<table>\u30fb<tr>\u30fb<th>\u30fb<td>\u3068\u3044\u30464\u7a2e\u985e\u306e\u30bf\u30b0\u3067\u8868\u73fe\u3057\u307e\u3059\u3002\u305d\u308c\u305e\u308c\u306e\u5f79\u5272\u306f\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u3002<tr>\u30fb<th>\u30fb<td>\u306f\u540d\u79f0\u304c\u4f3c\u3066\u3044\u3066\u7d1b\u3089\u308f\u3057\u3044\u306e\u3067\u3001\u4f55\u306e\u7565\u8a9e\u304b\u3092\u77e5\u308b\u3068\u899a\u3048\u3084\u3059\u304f\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n\n\n\n

table\u8981\u7d20<\/h4>\n\n\n

\u8868\u306e\u7bc4\u56f2\u3092\u56f2\u307f\u307e\u3059\u3002<\/p>\n\n\n

tr\u8981\u7d20<\/h4>\n\n\n

\u300cTable Row\uff08\u884c\uff09\u300d\u306e\u7565\u8a9e\u3067\u3001\u8868\u306b\u304a\u3051\u308b\u884c\u30921\u3064\u4f5c\u6210\u3057\u307e\u3059\u3002<\/p>\n\n\n

th\u8981\u7d20<\/h4>\n\n\n

\u300cTable Header\uff08\u898b\u51fa\u3057\uff09\u300d\u306e\u7565\u8a9e\u3067\u3001\u8868\u306b\u304a\u3051\u308b\u898b\u51fa\u3057\u3068\u306a\u308b\u30bb\u30eb\u30921\u3064\u4f5c\u6210\u3057\u307e\u3059\u3002<\/span><\/p>\n\n\n

td\u8981\u7d20<\/h4>\n\n\n

\u300cTable Data\uff08\u30c7\u30fc\u30bf\uff09\u300d\u306e\u7565\u8a9e\u3067\u3001\u8868\u306b\u304a\u3051\u308b\u30c7\u30fc\u30bf\u3068\u306a\u308b\u30bb\u30eb\u30921\u3064\u4f5c\u6210\u3057\u307e\u3059\u3002<\/p>\n

<table>\u3067\u30c6\u30fc\u30d6\u30eb\u5168\u4f53\u3092\u56f2\u307f\u3001<tr>\u30fb<td>\u30fb<th>\u3092\u7d44\u307f\u5408\u308f\u305b\u3066\u8868\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002<\/p>\n

\u5148\u307b\u3069\u306e\u8868\u3092\u5b9f\u969b\u306b\u30b3\u30fc\u30c9\u3067\u66f8\u3044\u3066\u307f\u308b\u3068\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n

\u3010\u5b9f\u884c\u30b3\u30fc\u30c9\u3011<\/strong><\/p>\n\n\n

<table border=\"1\">\n<tr><th>\u540d\u524d<\/th><th>\u70b9\u6570<\/th><\/tr>\n<tr><td>\u7530\u4e2d<\/td><td>100<\/td><\/tr>\n<tr><td>\u5c71\u7530<\/td><td>80<\/td><\/tr>\n<tr><td>\u4f50\u85e4<\/td><td>90<\/td><\/tr>\n<\/table><\/code><\/pre>\n\n\n
\u3010\u5b9f\u884c\u7d50\u679c\u3011<\/strong><\/p>\n\n\n\n\n\n
\u4e0a\u8a18\u304c\u8868\u3092\u4f5c\u6210\u3059\u308b\u57fa\u672c\u306e\u69cb\u9020\u3068\u306a\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n
1\u884c\u76ee\u306e<\/p>\n\n\n
<table border=\"1\"><\/code><\/pre>\n\n\n
\u306b\u3064\u3044\u3066\u306f\u5f8c\u8ff0\u3057\u307e\u3059\u3002<\/p>\n\n\n
\n
\u30d7\u30ed\u30b0\u30e9\u30df\u30f3\u30b0\u306e\u57fa\u790e\u304b\u3089\u30b5\u30a4\u30c8\u5236\u4f5c\u307e\u3067
\u2193\u5b9f\u8df5\u529b\u304c\u8eab\u306b\u3064\u304f\u30d7\u30ed\u30b0\u30e9\u30df\u30f3\u30b0\u30b9\u30af\u30fc\u30eb\u2193<\/a><\/p>\n<\/div>\n
\"IT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u5b66\u6821<\/a><\/div>\n
\n
\u226b\u30e2\u30cb\u30bf\u30fc\u5272\u5f15\u30ad\u30e3\u30f3\u30da\u30fc\u30f3\u5b9f\u65bd\u4e2d\uff01\u226a<\/font><\/a><\/p>\n<\/div>\n\n\n\n
\u30c6\u30fc\u30d6\u30eb\u306e\u88c5\u98fe<\/h2>\n\n\n\n
\u67a0\u7dda\u3092\u3064\u3051\u308b\u300cborder\u5c5e\u6027\u300d<\/h3>\n\n\n
\u8868\u306b\u67a0\u7dda\u3092\u3064\u3051\u308b\u5834\u5408\u306f\u3001border\u5c5e\u6027\u3092\u4f7f\u7528\u3057\u307e\u3059\u3002<\/p>\n
\u3010\u4f7f\u7528\u30a4\u30e1\u30fc\u30b8\u3011<\/strong><\/p>\n\n\n
<table border=\"1\u4ee5\u4e0a\u306e\u6574\u6570\"><\/code><\/pre>\n\n\n
\u524d\u9805\u306e1\u884c\u76ee\u306b<\/p>\n\n\n
<table border=\"1\"><\/code><\/pre>\n\n\n
\u3068\u8a18\u8ff0\u3057\u307e\u3057\u305f\u304c\u3001border\u306f\u3001\u8868\u306e\u67a0\u7dda\u3092\u3064\u3051\u308b\u5c5e\u6027\uff08\u30d7\u30ed\u30d1\u30c6\u30a3\uff09\u3067\u3059\u3002\u300c=\u201d\uff5e\u2033\u300d\u306e\uff5e\u306e\u90e8\u5206\u3067\u67a0\u306e\u5e45\u3092\u6307\u5b9a\u3057\u307e\u3059\u3002\uff5e\u90e8\u5206\u306b\u5165\u308c\u3089\u308c\u308b\u6570\u5b57\u306f1\u4ee5\u4e0a\u306e\u6574\u6570\u306e\u307f\u3067\u3059\u30021\u306f1Px\uff08\u30d4\u30af\u30bb\u30eb\uff09\u3092\u6307\u3057\u307e\u3059\u3002<\/p>\n
\u8981\u7d20\u3068\u5c5e\u6027\u306e\u9055\u3044<\/strong><\/span><\/p>\n
\n