{"id":4346,"date":"2016-12-25T12:00:07","date_gmt":"2016-12-25T03:00:07","guid":{"rendered":"http:\/\/www.y-com.info\/contents\/?p=4346"},"modified":"2021-06-24T10:19:20","modified_gmt":"2021-06-24T01:19:20","slug":"%e3%83%86%e3%83%bc%e3%83%96%e3%83%ab%e3%82%92%e3%83%ac%e3%82%b9%e3%83%9d%e3%83%b3%e3%82%b7%e3%83%96%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3%e3%81%ab%e5%af%be%e5%bf%9c%e3%81%99%e3%82%8b%e3%81%9f%e3%82%81","status":"publish","type":"post","link":"https:\/\/y-com.info\/contents\/?p=4346","title":{"rendered":"\u30c6\u30fc\u30d6\u30eb\u3092\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30c7\u30b6\u30a4\u30f3\u306b\u5bfe\u5fdc\u3059\u308b\u305f\u3081\u306eCSS\u3092\u4f7f\u3063\u305f\u30ec\u30a4\u30a2\u30a6\u30c8\u30d1\u30bf\u30fc\u30f3"},"content":{"rendered":"<p><span class=\"anchor\"><a id=\"anc_01\"><\/a><\/span><\/p>\n<section class=\"entry__section\">\n\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30c7\u30b6\u30a4\u30f3\u3092\u3057\u3066\u3044\u308b\u3068\u60a9\u307e\u3055\u308c\u308b\u3093\u304c\u30c6\u30fc\u30d6\u30eb\u306e\u30c7\u30b6\u30a4\u30f3\u3067\u3059\u3002<br \/>\nPC\u306e\u753b\u9762\u3068\u9055\u3063\u3066\u8868\u793a\u9818\u57df\u304c\u72ed\u3044\u306e\u3067\u3001\u5de5\u592b\u3057\u306a\u3044\u3068\u3046\u307e\u304f\u30c6\u30fc\u30d6\u30eb\u3092\u8868\u793a\u3067\u304d\u307e\u305b\u3093\u3002<br \/>\nCSS\u3092\u4f7f\u3063\u3066\u30c6\u30fc\u30d6\u30eb\u3092\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30c7\u30b6\u30a4\u30f3\u3059\u308b\u305f\u3081\u306e\u30d1\u30bf\u30fc\u30f3\u3092\uff13\u3064\u7d39\u4ecb\u3057\u307e\u3059\u3002<\/p>\n<ul class=\"entry__index\">\n<li><a href=\"#anc_01\">\u898b\u51fa\u3057\u3068\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u4ea4\u4e92\u306b\u7e26\u8868\u793a<\/a><\/li>\n<li><a href=\"#anc_02\">\u30c6\u30fc\u30d6\u30eb\u306e\u7e26\u6a2a\u3092\u5207\u308a\u66ff\u3048\u308b<\/a><\/li>\n<li><a href=\"#anc_03\">\u30c6\u30fc\u30d6\u30eb\u305d\u306e\u3082\u306e\u3092\u30b9\u30af\u30ed\u30fc\u30eb<\/a><\/li>\n<\/ul>\n<h2 class=\"section__title\">\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u3067\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u5909\u66f4\u3059\u308b<\/h2>\n<p>\u4e00\u822c\u7684\u306b\u30c6\u30fc\u30d6\u30eb\u306fTable\u30bf\u30b0\u3092\u4f7f\u3063\u3066\u3044\u308b\u3067\u3057\u3087\u3046\u3002<br \/>\n\u305d\u306e\u69cb\u6210\u8981\u7d20\u306f\u3001Table\u306fdisplay:table\u304c\u521d\u671f\u5024\u3067\u3001td\u3084th\u30bf\u30b0\u306ftable-cell\u304c\u521d\u671f\u5024\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u3002<br \/>\n\u3053\u308c\u3089\u3092\u64cd\u4f5c\u3059\u308b\u3053\u3068\u3067\u3001\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u306b\u5bfe\u5fdc\u3057\u307e\u3059\u3002<br \/>\n<span class=\"anchor\"><a id=\"anc_01\"><\/a><\/span><\/p>\n<h3 class=\"section__title2\">\u898b\u51fa\u3057\u3068\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u4ea4\u4e92\u306b\u7e26\u8868\u793a<\/h3>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/img.png\" alt=\"img\" width=\"800\" height=\"440\" class=\"alignnone size-full wp-image-5117\" srcset=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/img.png 800w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/img-300x165.png 300w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/>\u6700\u3082\u30b7\u30f3\u30d7\u30eb\u3067\u4e00\u822c\u7684\u306a\u30b9\u30bf\u30a4\u30eb\u3002<br \/>\n\u4f1a\u793e\u6982\u8981\u3068\u304b\u306b\u4f7f\u308f\u308c\u3066\u3044\u308b\u3088\u3046\u306a\u3001\u5de6\u5074\u306b\u898b\u51fa\u3057\u304c\u3042\u3063\u3066\u53f3\u5074\u306b\u305d\u306e\u5185\u5bb9\u304c\u66f8\u304b\u308c\u3066\u3044\u308b\u3088\u3046\u306a\u5834\u5408\u3002<\/p>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\ntable {\r\n  border-collapse: collapse;\r\n}\r\ntable td, table th {\r\n  padding: 10px;\r\n}\r\ntable th {\r\n  background-color: #eee;\r\n}\r\n<\/pre>\n<p>\u30a6\u30a3\u30f3\u30c9\u30a6\u304c\u5c0f\u3055\u304f\u306a\u3063\u305f\u6642\u306f\u3001\u7e26\u306b\u4e26\u3079\u308b\u3053\u3068\u3067\u72ed\u3044\u5e45\u3067\u3082\u8aad\u307f\u3084\u3059\u3044\u30ec\u30a4\u30a2\u30a6\u30c8\u306b\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table6.png\" alt=\"\u30c6\u30fc\u30d6\u30eb\u30ec\u30a4\u30a2\u30a6\u30c8\u306e\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u5bfe\u5fdc\" width=\"964\" height=\"608\" class=\"alignnone size-full wp-image-4373\" srcset=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table6.png 964w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table6-300x189.png 300w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table6-800x505.png 800w\" sizes=\"auto, (max-width: 964px) 100vw, 964px\" \/><br \/>\n\u5b9f\u969b\u306e\u52d5\u304d\u306f\u3053\u3093\u306a\u611f\u3058\u3067\u3059\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table1.gif\" alt=\"table\" width=\"982\" height=\"569\" class=\"alignnone size-full wp-image-5123\" \/><br \/>\n\u3053\u308c\u306f\u3080\u3061\u3083\u304f\u3061\u3083\u7c21\u5358\u3002<br \/>\n\u30c6\u30fc\u30d6\u30eb\u306etd, th\u306bdisplay:block;\u3092\u6307\u5b9a\u3057\u3066\u7e26\u4e26\u3073\u306b\u3057\u307e\u3059\u3002<br \/>\n\u305d\u308c\u305e\u308c\u306e\u30bb\u30eb\u306f\u6a2a\u5e45\u3044\u3063\u3071\u3044\u306b\u8868\u793a\u3055\u305b\u308b\u305f\u3081\u3001width:100%;\u3092\u5165\u308c\u3066\u304a\u304d\u307e\u3057\u3087\u3046\u3002<\/p>\n<div class=\"code\">\n<div class=\"code__type\">\u629c\u7c8b<\/div>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\ntable td, table th {\r\n  display: block;\r\n  width: 100%;\r\n}\r\n<\/pre>\n<\/div>\n<p>\u5168\u4f53\u306eCSS\u3068\u3057\u3066\u306f\u3053\u3093\u306a\u611f\u3058\u3002<\/p>\n<div class=\"code\">\n<div class=\"code__type\">\u5168\u4f53<\/div>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\ntable {\r\n  border-collapse: collapse;\r\n}\r\ntable td, table th {\r\n  display: block;\r\n  padding: 10px;\r\n}\r\ntable th {\r\n  background-color: #eee;\r\n}\r\n<\/pre>\n<\/div>\n<p>\u3053\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u306f\u3001\u554f\u3044\u5408\u308f\u305b\u306a\u3069\u306e\u30da\u30fc\u30b8\u3067\u3082\u4f7f\u3048\u307e\u3059\u3088\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table9.png\" alt=\"\u554f\u3044\u5408\u308f\u305b\u30da\u30fc\u30b8\u306e\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u5bfe\u5fdc\" width=\"1451\" height=\"535\" class=\"alignnone size-full wp-image-4383\" srcset=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table9.png 1451w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table9-300x111.png 300w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table9-800x295.png 800w\" sizes=\"auto, (max-width: 1451px) 100vw, 1451px\" \/><\/p>\n<p><!--\n<span class=\"anchor\"><a id=\"anc_04\"><\/a><\/span>\n\n\n<h3 class=\"section__title2\">\u6a2a\u9577\u306e\u30c6\u30fc\u30d6\u30eb\u3092\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u3067\u7e26\u578b\u30ea\u30b9\u30c8\u8868\u793a\u306b<\/h3>\n\n\n\u3053\u308c\u3092\u9069\u7528\u3067\u304d\u308b\u306e\u306f\u3001\u5de6\u5074\u306b\u898b\u51fa\u3057\u304c\u3042\u3063\u3066\u3001\u305d\u308c\u306b\u5bfe\u3059\u308btd\u8981\u7d20\u304c\u53f3\u5074\u306b\u8907\u6570\u4e26\u3093\u3067\u3044\u308b\u3088\u3046\u306a\u5834\u5408\u3002\n\u53f3\u5074\u306b\u4e26\u3093\u3067\u3044\u308b\u8981\u7d20\u3092\u30ea\u30b9\u30c8\u5316\u3057\u3066\u7e26\u306b\u4e26\u3079\u307e\u3059\u3002\n\u5177\u4f53\u7684\u306b\u306f\u3053\u3093\u306a\u611f\u3058\u3002\n\n--><\/p>\n<p><span class=\"anchor\"><a id=\"anc_02\"><\/a><\/span><\/p>\n<h3 class=\"section__title2\">\u30c6\u30fc\u30d6\u30eb\u306e\u7e26\u6a2a\u3092\u5207\u308a\u66ff\u3048\u308b<\/h3>\n<p>\u6599\u91d1\u8868\u3084\u30d7\u30e9\u30f3\u306e\u6848\u5185\u306a\u3069\u3001\u6a2a\u306b\u9577\u304f\u4e26\u3076\u3088\u3046\u306a\u30c6\u30fc\u30d6\u30eb\u306e\u5834\u5408\u306f\u30b9\u30de\u30db\u3067\u306f\u306f\u307f\u51fa\u3066\u3057\u307e\u3044\u307e\u3059\u3002<br \/>\n\u540c\u3058\u3088\u3046\u306a\u4e26\u3073\u3067\u3042\u308c\u3070\u3001\u7e26\u306b\u3057\u305f\u3063\u3066\u304b\u307e\u308f\u306a\u3044\u306e\u3067\u3001\u6a2a\u306e\u30c6\u30fc\u30d6\u30eb\u3092\u7e26\u306b\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table5.png\" alt=\"\u30c6\u30fc\u30d6\u30eb\u306e\u7e26\u6a2a\u3092\u56de\u8ee2\u3055\u305b\u308b\" width=\"964\" height=\"336\" class=\"alignnone size-full wp-image-4371\" srcset=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table5.png 964w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table5-300x105.png 300w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table5-800x279.png 800w\" sizes=\"auto, (max-width: 964px) 100vw, 964px\" \/><br \/>\n\u5b9f\u969b\u306e\u52d5\u304d\u306f\u3053\u3093\u306a\u611f\u3058\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table.gif\" alt=\"table\" width=\"982\" height=\"569\" class=\"alignnone size-full wp-image-5121\" \/><\/p>\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\r\n&lt;table&gt;\r\n  &lt;thead&gt;\r\n    &lt;tr&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;\/tr&gt;\r\n  &lt;\/thead&gt;\r\n  &lt;tbody&gt;\r\n    &lt;tr&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;\/tr&gt;\r\n    &lt;tr&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;\/tr&gt;\r\n    &lt;tr&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;td&gt;\u3007&lt;\/td&gt;&lt;\/tr&gt;\r\n  &lt;\/tbody&gt;\r\n&lt;\/table&gt;\r\n<\/pre>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\ntable {\r\n  border-collapse: collapse;\r\n}\r\ntable td, table th {\r\n  padding: 10px;\r\n  text-align: center;\r\n}\r\ntable th {\r\n  background-color: #eee;\r\n}\r\n<\/pre>\n<p>\u7e26\u6a2a\u3092\u53cd\u8ee2\u3055\u305b\u308b\u3068\u3044\u3046\u3068\u3061\u3087\u3063\u3068\u8907\u96d1\u306b\u601d\u3048\u307e\u3059\u304c\u3001\u8003\u3048\u65b9\u306f\u7c21\u5358\u3002<br \/>\nthead\u3068tbody\u304c\u7e26\u306b\u4e26\u3093\u3067\u3044\u308b\u306e\u3092\u3001float\u3067\u6a2a\u306b\u4e26\u3079\u307e\u3059\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table3.png\" alt=\"\u30c6\u30fc\u30d6\u30eb\u3068\u7e26\u6a2a\u958b\u5e97\u3055\u305b\u308b\" width=\"610\" height=\"300\" class=\"alignnone size-full wp-image-4360\" srcset=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table3.png 610w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table3-300x148.png 300w\" sizes=\"auto, (max-width: 610px) 100vw, 610px\" \/><br \/>\n\u3053\u306e\u5927\u67a0\u3055\u3048\u3064\u304b\u3081\u3066\u3044\u308c\u3070\u3001\u30b3\u30fc\u30c9\u306f\u305d\u3093\u306a\u306b\u96e3\u3057\u304f\u306a\u3044\u3067\u3057\u3087\u3046\u3002<\/p>\n<div class=\"code\">\n<div class=\"code__type\">\u629c\u7c8b<\/div>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\n  table thead {\r\n    display: block;\r\n    float: left;\r\n    width: 30%;\r\n  }\r\n  table tbody {\r\n    display: block;\r\n    float: left;\r\n    width: 70%;\r\n  }\r\n<\/pre>\n<\/div>\n<p>tbody\u5185\u306etr\u306f\u7e26\u306b\u4e26\u3093\u3067\u3044\u305f\u3082\u306e\u3092\u6a2a\u306b\u3057\u306a\u3044\u3068\u3044\u3051\u306a\u3044\u306e\u3067\u3001display:block;\u3068float:left\u3092\u6307\u5b9a\u3057\u3066\u6a2a\u4e26\u3073\u306b\u3057\u307e\u3059\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table4.png\" alt=\"\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30c6\u30fc\u30d6\u30eb\u306etr\u306e\u6307\u5b9a\" width=\"610\" height=\"300\" class=\"alignnone size-full wp-image-4363\" srcset=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table4.png 610w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table4-300x148.png 300w\" sizes=\"auto, (max-width: 610px) 100vw, 610px\" \/><\/p>\n<div class=\"code\">\n<div class=\"code__type\">\u629c\u7c8b<\/div>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\n  table tr {\r\n    display: block;\r\n    float: left;\r\n  }\r\n  table thead tr {\r\n    width: 100%;\r\n  }\r\n  table tbody tr {\r\n    width: 30%;\r\n  }\r\n<\/pre>\n<\/div>\n<p>\u3055\u3089\u306b\u305d\u306e\u4e2d\u306eth\u3084td\u306f\u7e26\u4e26\u3073\u306b\u306a\u308b\u306e\u3067\u3001\u4e00\u756a\u521d\u3081\u306b\u7d39\u4ecb\u3057\u305f\u30c6\u30af\u30cb\u30c3\u30af\u3092\u4f7f\u3046\u305f\u3081\u306bdisplay:block;\u3092\u6307\u5b9a\u3057\u307e\u3059\u3002<br \/>\n\u3061\u3087\u3063\u3068\u3084\u3084\u3053\u3057\u3044\u306e\u3067\u3059\u304c\u3001\u7e26\u5217\u306b\u5909\u66f4\u3059\u308b\u65b9\u6cd5\u3067\u306f\u6a2a\u5217\u306e\u9ad8\u3055\u304c\u9023\u52d5\u3057\u307e\u305b\u3093\u3002<br \/>\n\u306a\u306e\u3067\u3001td\u3084th\u306b\u56fa\u5b9a\u306e\u9ad8\u3055\u3092\u8a2d\u5b9a\u3057\u3066\u30ec\u30a4\u30a2\u30a6\u30c8\u306e\u5d29\u308c\u3092\u9632\u3044\u3067\u3044\u307e\u3059\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table7.png\" alt=\"\u30c6\u30fc\u30d6\u30eb\u306e\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30ec\u30a4\u30a2\u30a6\u30c8\u306etd\u306e\u6307\u5b9a\" width=\"174\" height=\"300\" class=\"alignnone size-full wp-image-4376\" \/><\/p>\n<div class=\"code\">\n<div class=\"code__type\">\u629c\u7c8b<\/div>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\n  table tr td, table tr th {\r\n    display: block;\r\n    height: 40px;\r\n  }\r\n<\/pre>\n<\/div>\n<p>\u5168\u4f53\u3068\u3057\u3066\u306f\u3053\u306e\u3088\u3046\u306aCSS\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n<div class=\"code\">\n<div class=\"code__type\">\u5168\u4f53<\/div>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\n@media only screen and (max-width: 800px) {\r\n  table {\r\n    width: 100%;\r\n  }\r\n  table tr {\r\n    display: block;\r\n    float: left;\r\n  }\r\n  table tr td, table tr th {\r\n    display: block;\r\n    height: 40px;\r\n  }\r\n  table thead {\r\n    display: block;\r\n    float: left;\r\n    width: 30%;\r\n  }\r\n  table thead tr {\r\n    width: 100%;\r\n  }\r\n  table tbody {\r\n    display: block;\r\n    float: left;\r\n    width: 70%;\r\n  }\r\n  table tbody tr {\r\n    width: 30%;\r\n  }\r\n}\r\n<\/pre>\n<\/div>\n<h2 class=\"section__title\">\u30b9\u30bf\u30a4\u30eb\u3092\u5909\u66f4\u305b\u305a\u5358\u7d14\u306b\u30b9\u30af\u30ed\u30fc\u30eb\u3092\u5229\u7528\u3059\u308b\u65b9\u6cd5<\/h2>\n<p><span class=\"anchor\"><a id=\"anc_03\"><\/a><\/span><\/p>\n<h3 class=\"section__title2\">\u30c6\u30fc\u30d6\u30eb\u305d\u306e\u3082\u306e\u3092\u30b9\u30af\u30ed\u30fc\u30eb<\/h3>\n<p>\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30c7\u30b6\u30a4\u30f3\u3068\u3044\u3046\u3068\u30a6\u30a3\u30f3\u30c9\u30a6\u30b5\u30a4\u30ba\u306b\u3088\u3063\u3066\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u5909\u66f4\u3057\u306a\u3044\u3068\u3044\u3051\u306a\u3044\u6c17\u306b\u306a\u308a\u307e\u3059\u304c\u3001<br \/>\n\u30c6\u30fc\u30d3\u30eb\u306f\u305d\u306e\u7e26\u6a2a\u306e\u60c5\u5831\u3063\u3066\u3044\u3046\u306e\u3082\u975e\u5e38\u306b\u91cd\u8981\u3060\u3063\u305f\u308a\u3059\u308b\u306e\u3067\u3080\u3084\u307f\u306b\u5909\u3048\u306a\u3044\u65b9\u304c\u3044\u3044\u3053\u3068\u3082\u3042\u308a\u307e\u3059\u3002<br \/>\n\u7279\u306b\u6a2a\u9577\u306e\u30c6\u30fc\u30d6\u30eb\u306f\u6a2a\u30b9\u30af\u30ed\u30fc\u30eb\u3092\u4f7f\u3046\u3068\u3044\u3046\u65b9\u6cd5\u3082\u3042\u308a\u307e\u3059\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table.png\" alt=\"\u30c6\u30fc\u30d6\u30eb\" width=\"1014\" height=\"232\" class=\"alignnone size-full wp-image-4347\" srcset=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table.png 1014w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table-300x69.png 300w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table-800x183.png 800w\" sizes=\"auto, (max-width: 1014px) 100vw, 1014px\" \/><br \/>\n\u3053\u3046\u3044\u3063\u305f\u30c6\u30fc\u30d6\u30eb\u3092\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u5909\u3048\u305a\u306b\u30b9\u30de\u30db\u3067\u898b\u3048\u308b\u3088\u3046\u306b\u3057\u305f\u3044\u5834\u5408\u306f\u3001\u3053\u306e\u3088\u3046\u306b\u30b9\u30af\u30ed\u30fc\u30eb\u3055\u305b\u307e\u3059\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.y-com.info\/contents\/wp-content\/uploads\/2016\/12\/ani3.gif\" alt=\"\u30b9\u30af\u30ed\u30fc\u30eb\u30c6\u30fc\u30d6\u30eb\" width=\"500\" height=\"294\" class=\"alignnone size-full wp-image-4348\" srcset=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/ani3.gif 500w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/ani3-300x176.gif 300w\" sizes=\"auto, (max-width: 500px) 100vw, 500px\" \/><br \/>\n\u30b9\u30af\u30ed\u30fc\u30eb\u3055\u305b\u308b\u305f\u3081\u306b\u3001\u30c6\u30fc\u30d6\u30eb\u81ea\u4f53\u3092div\u306a\u3069\u306e\u8981\u7d20\u3067\u56f2\u307f\u307e\u3059\u3002<br \/>\n\u5916\u67a0\u306ediv\u81ea\u4f53\u306f\u30a6\u30a3\u30f3\u30c9\u30a6\u306e\u30b5\u30a4\u30ba\u3067\u53ef\u5909\u306b\u306a\u308b\u3082\u306e\u3068\u3057\u3066\u3001\u30c6\u30fc\u30d6\u30eb\u8981\u7d20\u306f\u56fa\u5b9a\u5024\uff08\u4f8b\u3060\u3068width:1000px;\uff09\u3067\u5e45\u3092\u3068\u308a\u307e\u3059\u3002<br \/>\n\u5916\u67a0\u306ediv\u306boverflow-x:scroll;\u3092\u5165\u308c\u308b\u3068\u3053\u306e\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table2.png\" alt=\"\u30c6\u30fc\u30d6\u30eb\u3068\u30b9\u30af\u30ed\u30fc\u30eb\" width=\"1014\" height=\"270\" class=\"alignnone size-full wp-image-4358\" srcset=\"https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table2.png 1014w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table2-300x80.png 300w, https:\/\/y-com.info\/contents\/wp-content\/uploads\/2016\/12\/table2-800x213.png 800w\" sizes=\"auto, (max-width: 1014px) 100vw, 1014px\" \/><\/p>\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\r\n&lt;div class=&quot;outer&quot;&gt;\r\n  &lt;table&gt;\r\n    &lt;thead&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;th&gt;\u898b\u51fa\u3057&lt;\/th&gt;&lt;\/thead&gt;\r\n    &lt;tbody&gt;\r\n      &lt;tr&gt;\r\n        &lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;\r\n      &lt;\/tr&gt;\r\n      &lt;tr&gt;\r\n        &lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;\r\n      &lt;\/tr&gt;\r\n      &lt;tr&gt;\r\n        &lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;\r\n      &lt;\/tr&gt;\r\n      &lt;tr&gt;\r\n        &lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;\r\n      &lt;\/tr&gt;\r\n      &lt;tr&gt;\r\n        &lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;&lt;td&gt;\u30b3\u30f3\u30c6\u30f3\u30c4&lt;\/td&gt;\r\n      &lt;\/tr&gt;\r\n    &lt;\/tbody&gt;\r\n  &lt;\/table&gt;\r\n&lt;\/div&gt;\r\n<\/pre>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\n.outer {\r\n  width: 100%;\r\n}\r\n\r\ntable {\r\n  border-collapse: collapse;\r\n  width: 1000px;\r\n}\r\ntable td, table th {\r\n  border: 1px solid #ccc;\r\n  padding: 10px;\r\n}\r\ntable th {\r\n  background-color: #eee;\r\n}\r\n<\/pre>\n<\/section>\n<p>\u4ee5\u4e0a\u3001\uff13\u3064\u306e\u30d1\u30bf\u30fc\u30f3\u3092\u7d39\u4ecb\u3057\u307e\u3057\u305f\u3002<br \/>\n\u7d30\u304b\u3044\u90e8\u5206\u3067\u306f\u69d8\u3005\u5bfe\u5fdc\u304c\u5fc5\u8981\u306b\u306a\u308b\u304b\u3082\u3057\u308c\u307e\u305b\u3093\u304c\u3001\u5927\u304d\u304f\u306f\u3053\u308c\u3089\u306e\u30d1\u30bf\u30fc\u30f3\u3092\u77e5\u3063\u3066\u3044\u308b\u3068\u3044\u3044\u3067\u3059\u3088\u3002<br \/>\n\u4ed6\u306b\u3082jQuery\u3084box\u6307\u5b9a\u3092\u4f7f\u3063\u305f\u65b9\u6cd5\u3082\u3042\u308b\u306e\u3067\u3001\u6a5f\u4f1a\u304c\u3042\u308c\u3070\u7d39\u4ecb\u3057\u307e\u3059\u3002<\/p>\n\n\t<div class=\"adbanner\" style=\"margin:0 0 30px 0;\">\n\t\t<iframe loading=\"lazy\" style=\"margin:0\tauto;\" src=\"https:\/\/rcm-fe.amazon-adsystem.com\/e\/cm?o=9&p=48&l=ur1&category=amazonrotate&f=ifr&linkID=528672f6928aa364301f0b83e4e61d09&t=yossyhomepage-22&tracking_id=yossyhomepage-22\" width=\"728\" height=\"90\" scrolling=\"no\" border=\"0\" marginwidth=\"0\" style=\"border:none;\" frameborder=\"0\"><\/iframe>\n\t<\/div>\n\t","protected":false},"excerpt":{"rendered":"<p>\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30c7\u30b6\u30a4\u30f3\u3092\u3057\u3066\u3044\u308b\u3068\u60a9\u307e\u3055\u308c\u308b\u3093\u304c\u30c6\u30fc\u30d6\u30eb\u306e\u30c7\u30b6\u30a4\u30f3\u3067\u3059\u3002 PC\u306e\u753b\u9762\u3068\u9055\u3063\u3066\u8868\u793a\u9818\u57df\u304c\u72ed\u3044\u306e\u3067\u3001\u5de5\u592b\u3057\u306a\u3044\u3068\u3046\u307e\u304f\u30c6\u30fc\u30d6\u30eb\u3092\u8868\u793a\u3067\u304d\u307e\u305b\u3093\u3002 CSS\u3092\u4f7f\u3063\u3066\u30c6\u30fc\u30d6\u30eb\u3092\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30c7\u30b6\u30a4\u30f3\u3059\u308b\u305f\u3081\u306e\u30d1\u30bf\u30fc\u30f3\u3092 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":4380,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[37,72,34,8,32],"tags":[81,82],"class_list":["post-4346","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-css","category-html","category-34","category-8","category-32","tag-css","tag-82"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=\/wp\/v2\/posts\/4346","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=4346"}],"version-history":[{"count":32,"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=\/wp\/v2\/posts\/4346\/revisions"}],"predecessor-version":[{"id":5125,"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=\/wp\/v2\/posts\/4346\/revisions\/5125"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=\/wp\/v2\/media\/4380"}],"wp:attachment":[{"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=4346"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=4346"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/y-com.info\/contents\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=4346"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}