{"id":550,"date":"2019-10-12T21:46:52","date_gmt":"2019-10-12T12:46:52","guid":{"rendered":"https:\/\/blog.azarashi-server.com\/?p=550"},"modified":"2019-12-20T04:57:11","modified_gmt":"2019-12-19T19:57:11","slug":"post-550","status":"publish","type":"post","link":"https:\/\/blog.azarashi-server.com\/?p=550","title":{"rendered":"web\u30b5\u30a4\u30c8\u3092\u4f5c\u3063\u3066\u307f\u305f\u3044"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">web\u30b5\u30a4\u30c8\u4f5c\u3063\u3066\u307f\u305f\u3044\u306a\uff5e\u3063\u3066\u601d\u3063\u305f\u3053\u3068\u304c\u3042\u308b\u4eba\u306f<br>\u7d50\u69cb\u3044\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u3002<br>\u305d\u3093\u306a\u4eba\u5411\u3051\u306e\u8d85\uff01\u5165\u9580\u7de8\u306e\u8a18\u4e8b\u3067\u3059\u3002<br>\uff08\u5f53\u30a2\u30b6\u30e9\u30b7\u30db\u30fc\u30eb\u3067\u306f\u203b\u30d7\u30ed\u306e\u3054\u904a\u622f\u306f\u304a\u65ad\u308a\u3057\u3066\u304a\u308a\u307e\u3059\uff09<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u8a18\u4e8b\u3068\u3057\u3066\u306f\u304b\u306a\u308a\u9577\u3044\u306e\u3067\u899a\u609f\u306e\u6e96\u5099\u3092\u3057\u3066\u304a\u3044\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<p class=\"has-small-font-size wp-block-paragraph\">\u203b \u8a73\u7d30\u306a\u3053\u3068\u306f\u66f8\u304b\u305a\u306b\u3055\u3089\u3063\u3068\u66f8\u3044\u3066\u3001\u4f5c\u308b\u3053\u3068\u3078\u306e\u8208\u5473\u3092\u6301\u3064\u4eba\u3092\u5897\u3084\u3057\u305f\u3044\u8a18\u4e8b\u306a\u306e\u3067\u3001<br>\u3000web\u5236\u4f5c\u3068\u304b\u3082\u3046\u30d0\u30ea\u30d0\u30ea\u3084\u3063\u3066\u308b\u4eba\u306f<a href=\"https:\/\/qiita.com\/\">Qiita<\/a>\u3078\u3069\u3046\u305e\u3002<\/p>\n\n\n\n<!--more-->\n\n\n\n<h2 class=\"wp-block-heading\">0.\u305d\u3082\u305d\u3082\u3069\u3046\u3044\u3046\u306e\u4f5c\u308a\u305f\u3044\uff1f<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u25a0 <strong>\u898b\u305f\u76ee\u3068\u304b\u81ea\u5206\u3067\u8003\u3048\u3066\u3053\u3060\u308f\u3063\u3066\u3044\u304d\u305f\u3044\uff01 <\/strong><br>\u53c2\u8003\u306b\u306a\u308b\u304b\u308f\u304b\u308a\u307e\u305b\u3093\u304c\u3001\u8a18\u4e8b\u3092\u898b\u3066\u3044\u3063\u3066\u304f\u3060\u3055\u3044\u306d\uff01<br><strong>\u25a0 \u898b\u305f\u76ee\u81ea\u5206\u3067\u4f5c\u308b\u306e\u96e3\u3057\u3044\u3051\u3069\u306a\u3093\u304b\u4f5c\u308a\u305f\u3044\uff01<\/strong><br>\u53c2\u8003\u306b\u306a\u308b\u304b\u308f\u304b\u308a\u307e\u305b\u3093\u304c\u3001\u8a18\u4e8b\u3092\u898b\u3066\u3044\u3063\u3066\u304f\u3060\u3055\u3044\u306d\uff01 <br><strong>\u25a0 \u30d6\u30ed\u30b0\u3067\u826f\u3044\u304b\u3089\u304d\u308c\u3044\u306a\u898b\u305f\u76ee\u306e\u30b5\u30a4\u30c8\u3092\u4f5c\u308a\u305f\u3044\uff01<\/strong><br><em>\uff8a\uff67\uff5e\uff5e\uff5e\uff08\u30af\u30bd\u30c7\u30ab\u305f\u3081\u606f<\/em><br><a href=\"https:\/\/ja.wix.com\/ \">\u30fb WIX<\/a><br><a href=\"http:\/\/blog.livedoor.com\/\">\u30fb \u30e9\u30a4\u30d6\u30c9\u30a2\u30d6\u30ed\u30b0<\/a><br><a href=\"https:\/\/blog.fc2.com\/\">\u30fb fc2\u30d6\u30ed\u30b0<\/a><br><a href=\"https:\/\/www.exblog.jp\/\">\u30fb\u30a8\u30ad\u30b5\u30a4\u30c8\u30d6\u30ed\u30b0<\/a><br>Get out here.<br><strong>\u25a0 \u3053\u306e\u30d6\u30ed\u30b0\u307f\u305f\u3044\u306a\u306e(wordpress)\u3067\u4f5c\u308a\u305f\u3044\uff01<\/strong><br>\u3053\u308c\u306f\u4eca\u56de\u306e\u8a18\u4e8b\u3060\u3068\u8aac\u660e\u3059\u308b\u3068\u9577\u304f\u306a\u308b\u306e\u3067\u3001\u3044\u3064\u304b\u66f8\u304d\u307e\u3059<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">1.\u305d\u3082\u305d\u3082\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u3063\u3066\u4f55\u3067\u51fa\u6765\u3066\u308b\u306e<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u307f\u3093\u306a\u304c\u898b\u3066\u308b\u3053\u306e\u30b5\u30a4\u30c8\u3084\u3042\u3093\u306a\u30b5\u30a4\u30c8\u306f\u305d\u3082\u305d\u3082<br>\u4f55\u3067\u51fa\u6765\u3066\u308b\u3093\u3060\u308d\u3046\u30fb\u30fb\u30fb\u3068\u3044\u3046\u3068\u3053\u308d\u304b\u3089\u59cb\u307e\u308a\u307e\u3059\u3002<br>web\u30b5\u30a4\u30c8\u3092\u69cb\u6210\u3057\u3066\u3044\u308b\u57fa\u672c\u306e\u30d5\u30a1\u30a4\u30eb\u306f\u3053\u308c\u3089\u3067\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"462\" height=\"174\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website.jpg\" alt=\"\" class=\"wp-image-551\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website.jpg 462w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website-300x113.jpg 300w\" sizes=\"(max-width: 462px) 100vw, 462px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>.css<\/strong>\u3001<strong>.html<\/strong>\u3001<strong>.js<\/strong>\u306e\u30d5\u30a1\u30a4\u30eb\u3067\u5927\u4f53\u306e\u30b5\u30a4\u30c8\u306f\u3067\u304d\u3066\u3044\u307e\u3059\u3002<br>\u30b5\u30a4\u30c8\u306b\u3088\u3063\u3066\u306f .html\u3060\u3051\u3067\u4f5c\u3063\u3066\u3044\u308b\u5834\u5408\u3082\u3042\u308a\u307e\u3059\u306d\u3002<br>\u6700\u8fd1\u306f.html\u3060\u3051\u306e\u30b5\u30a4\u30c8\u306f\u4f59\u308a\u898b\u304b\u3051\u307e\u305b\u3093\u304c\u53e4\u3044\u30b5\u30a4\u30c8\u3068\u304b\u3060\u3068<br>\u305d\u3046\u3044\u3046\u4f5c\u308a\u3067\u3084\u3063\u3066\u3044\u308b\u5834\u5408\u3082\u3042\u308a\u307e\u3059\u3002<br>\u4f8b\u3048\u3070\u3000<a href=\"http:\/\/abehiroshi.la.coocan.jp\/\">\u963f\u90e8\u5bdb\u306e\u30db\u30fc\u30e0\u30da\u30fc\u30b8<\/a><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ed6\u306b\u306f .html \u3067\u306f\u306a\u304f .php \u3068\u3044\u3046\u30d5\u30a1\u30a4\u30eb\u3067\u30b5\u30a4\u30c8\u3092\u4f5c\u3063\u3066\u3044\u308b\u5834\u5408\u3082\u3042\u308a\u307e\u3059\u3002\uff08\u3053\u306e\u30b5\u30a4\u30c8\u3082\u305d\u3046\uff09<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u306f\u7121\u6599\u306e\u7bc4\u7587\u3067\u5b9f\u969b\u306b\u516c\u958b\u3067\u304d\u308b\u3068\u3053\u308d\u307e\u3067\u6301\u3063\u3066\u3044\u3051\u308b\u8a18\u4e8b\u306a\u306e\u3067<br>.php\u3067\u4f5c\u308b\u65b9\u6cd5\u306f\u66f8\u304d\u307e\u305b\u3093\u3002\u3068\u3044\u3046\u304b\u8d85\u5165\u9580\u306a\u306e\u306b .php \u51fa\u3059\u306e\u306f<br>\u30cf\u30fc\u30c9\u30eb\u4e0a\u304c\u3063\u3061\u3083\u3046\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">1-2.\u30d5\u30a1\u30a4\u30eb\u306e\u8aac\u660e<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>\u25a0 index.html<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306fweb\u30b5\u30a4\u30c8\u306e\u4e2d\u8eab\u304c\u66f8\u3044\u3066\u3042\u308a\u307e\u3059\u3002<br>\u4f8b\u3048\u3070 \u6587\u5b57\u3092\u66f8\u3044\u305f\u308a\u3001\u753b\u50cf\u3092\u8aad\u307f\u8fbc\u3080\u8a18\u8ff0\u3092\u66f8\u3044\u305f\u308a<br>\u52d5\u753b\u3084\u97f3\u697d\u3092\u8aad\u307f\u8fbc\u3080\u8a18\u8ff0\u3092\u66f8\u3044\u305f\u308a\u30fb\u30fb\u30fb<br>\u3068\u3001\u3053\u308c\u304c\u306a\u3051\u308c\u3070\u59cb\u307e\u3089\u306a\u3044\u30d5\u30a1\u30a4\u30eb\u3067\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>\u25a0 index.css<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">css\u3068\u306f  \u30ab\u30b9\u30b1\u30fc\u30c7\u30a3\u30f3\u30b0\u30fb\u30b9\u30bf\u30a4\u30eb\u30fb\u30b7\u30fc\u30c8 \u306e\u7565\u3067\u3059\u3002<br><a href=\"http:\/\/www.htmq.com\/csskihon\/001.shtml\">\u8a73\u7d30\u306a\u89e3\u8aac\u30b5\u30a4\u30c8 | CSS\u3068\u306f\uff1f<\/a><br>\u3053\u308c\u306f\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u898b\u305f\u76ee\u3092\u69cb\u6210\u3059\u308b\u30d5\u30a1\u30a4\u30eb\u3067\u3059\u3002<br>\u3053\u308c\u3092 .html \u5074\u3067\u8aad\u307f\u8fbc\u3093\u3067\u3042\u3052\u308b\u3053\u3068\u3067<br>\u753b\u50cf\u3092\u6a2a\u4e26\u3073\u306b\u3057\u305f\u308a\u3001\u6587\u5b57\u3092\u5927\u304d\u304f\u3057\u305f\u308a\u3001\u6587\u5b57\u306e\u8272\u3092\u5909\u3048\u305f\u308a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u963f\u90e8\u5bdb\u306e\u30db\u30fc\u30e0\u30da\u30fc\u30b8\u306e\u3088\u3046\u306b .css \u3092\u4f7f\u3063\u3066\u306a\u3044\u5834\u5408\u306f<br>.html \u5074\u306b\u76f4\u63a5css\u306b\u66f8\u304f\u898b\u305f\u76ee\u306e\u8a18\u8ff0\u3092\u66f8\u304f\u3053\u3068\u3067\u898b\u305f\u76ee\u3092\u5909\u3048\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u25a0 index.js<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">web\u30b5\u30a4\u30c8\u306b\u3088\u3063\u3066\u306f\u304d\u308c\u3044\u306a\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3<br>\u30ed\u30fc\u30c7\u30a3\u30f3\u30b0\u753b\u9762\u3001\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u958b\u9589\u3059\u308b\u8981\u7d20\u3001<br>\u753b\u50cf\u3092\u62bc\u3059\u3068\u5168\u753b\u9762\u3067\u8868\u793a\u3057\u3066\u304f\u308c\u308b\u7269\u3001<br>\u30b9\u30e9\u30a4\u30c9\u30b7\u30e7\u30fc\u306a\u3069\u306a\u3069\u3001\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3092\u3055\u305b\u305f\u308a<br>\u3059\u308b\u3082\u306e\u304c\u3088\u304f\u898b\u3089\u308c\u308b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u57fa\u672c\u3053\u308c\u3089\u306f JavaScript \u3068\u3044\u3046\u3082\u306e\u3067\u52d5\u3044\u3066\u3044\u307e\u3059\u3002<br>\uff08css\u3060\u3051\u3067\u5b9f\u88c5\u3067\u304d\u308b\u3082\u306e\u3082\u3042\u308b\u306e\u3067\u4e00\u5fdc\u57fa\u672c\u3068\u3057\u3066\u304a\u304d\u307e\u3059\uff09<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u25a0 \u4f59\u8ac7<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u7279\u306b\u8aac\u660e\u3057\u306a\u3044\u3067 index.html \u3068\u3044\u3046\u3088\u3046\u306b index \u3068\u3044\u3046\u30d5\u30a1\u30a4\u30eb\u540d\u3067<br>\u8aac\u660e\u3057\u3066\u304d\u3066\u3044\u307e\u3059\u304c index.html \u3068\u3044\u3046\u30d5\u30a1\u30a4\u30eb\u540d\u3067\u3042\u308b\u7406\u7531\u306f\u3042\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"http:\/\/www.dspt.net\/bgn\/003\/006.html\">\u4ed5\u7d44\u307f\u3092\u7406\u89e3\u3057\u3088\u3046<\/a><br>\u5148\u7a0b\u306e index.css, index.html, index.js \u306f\u30b5\u30fc\u30d0\u30fc\u306b\u30d5\u30a1\u30a4\u30eb\u3092\u3042\u3052\u308b\u3053\u3068\u3067\u3001\u30d6\u30e9\u30a6\u30b6\u304b\u3089\u898b\u308c\u308b\u3088\u3046\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30b5\u30fc\u30d0\u30fc\u5074\u306b index \u3068\u3044\u3046\u540d\u524d\u306e\u3064\u3044\u305f .html \u30d5\u30a1\u30a4\u30eb\u3092\u7528\u610f\u3059\u308b\u3053\u3068\u3067\u3001<br>\u30b5\u30fc\u30d0\u30fc\u5074\u304c\u81ea\u52d5\u3067\u691c\u7d22\u3057\u3066\u304f\u308c\u308b\u3088\u3046\u306b\u306a\u3063\u3066\u3044\u308b\u306e\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3061\u306a\u307f\u306b css, js \u306bindex\u3068\u3064\u3051\u3066\u3044\u308b\u306e\u306f\u7279\u306b\u7406\u7531\u306f\u306a\u3044\u3067\u3059\u304c\u3001<br>\u5b9f\u969b\u306b\u4f5c\u308b\u3068\u304d\u306f\u308f\u304b\u308a\u3084\u3059\u3044\u30d5\u30a1\u30a4\u30eb\u540d\u306b\u3059\u308b\u306e\u304c\u3044\u3044\u3067\u3059\u306d\u3002<br>\u5b9f\u52d9\u3067\u898b\u305f\u3053\u3068\u306e\u3042\u308b\u30d5\u30a1\u30a4\u30eb\u540d\u306e\u4ed8\u3051\u65b9\u306f<br>css\u3060\u3068 main.css, style.css, index.css \u304c\u591a\u304b\u3063\u305f\u5370\u8c61\u3067\u3059\u3002<br>js\u306f script.js, index.js, \u6a5f\u80fd\u306e\u540d\u524d(anime\u3068\u304bslider\u3068\u304b).js<br>\u3067\u3059\u304b\u306d\u3002\u305d\u3053\u3089\u8fba\u306f\u6700\u521d\u306f\u6df1\u304f\u8003\u3048\u305a\u3001\u308f\u304b\u308a\u3084\u3059\u3044\u30d5\u30a1\u30a4\u30eb\u540d\u3092\u3064\u3051\u308b<br>\u3068\u3060\u3051\u61b6\u3048\u3066\u304a\u3051\u3070\u3044\u3044\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3084\u3063\u3066\u3044\u304f\u3046\u3061\u306b\u3053\u3046\u3057\u305f\u3089\u826f\u3044\u3093\u3058\u3083\u306a\u3044\u304b\uff1f\u7b49\u51fa\u3066\u304f\u308b\u3068\u601d\u3044\u307e\u3059\u306e\u3067\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">2.\u3068\u308a\u3042\u3048\u305a\u4f5c\u3063\u3066\u307f\u3088\u3046\u3088\uff01<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u3042\u30fc\u3060\u3053\u30fc\u3060\u8aac\u660e\u3059\u308b\u3088\u308a\u306f\u5b9f\u969b\u306b\u4f5c\u3063\u3066\u307f\u308b\u306e\u304c\u4e00\u756a\u3044\u3044\u3067\u3059\u3002<br>\u767e\u805e\u306f\u4e00\u898b\u306b\u3057\u304b\u305a\u3000\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3051\u3069\u4f5c\u308b\u3063\u3066\u8a00\u3063\u3066\u3082\u3069\u3046\u3084\u3063\u3066\u4f5c\u308c\u3070\u3044\u3044\u306e\u3055\u30fb\u30fb\u30fb\uff08<a href=\"https:\/\/www.google.com\/search?q=%E3%81%A9%E3%81%86%E3%81%99%E3%82%8A%E3%82%83%E3%81%84%E3%81%84%E3%81%AE+%E3%82%B3%E3%83%AD%E3%82%B3%E3%83%AD&amp;source=lnms&amp;tbm=isch&amp;sa=X&amp;ved=0ahUKEwiO2IOooJjiAhWqHqYKHVqvC_QQ_AUIDigB&amp;biw=1680&amp;bih=947#imgrc=Otp0Y0CHLQIiPM:\">\uff7a\uff9b\uff7a\uff9baa\u7565<\/a><br>\u3068\u306a\u308b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">2.1\u3069\u3046\u3084\u3063\u3066\u306e\u3067\u4f5c\u3063\u3066\u308b\u306e\uff1f<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f5c\u308b\u306b\u3042\u305f\u3063\u3066\u3001\u5927\u4f53\u306f\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u7528\u306eIDE(\u7d71\u5408\u958b\u767a\u74b0\u5883)\u304b<br>sublimeText,Atom.VSCode\u7b49\u306e\u30c6\u30ad\u30b9\u30c8\u30a8\u30c7\u30a3\u30bf\u30fc\u7b49\u3092\u4f7f\u3063\u3066\u307e\u3059\u306d\u3002<br>windows\u4ed8\u5c5e\u306e\u30e1\u30e2\u5e33\u3060\u3051\u3067\u3082\u4f5c\u308b\u3053\u3068\u306f\u3067\u304d\u307e\u3059\u304c\u3001<br>\u5b9f\u969b\u30e1\u30e2\u5e33\u3067\u66f8\u3044\u3066\u308b\u4eba\u306a\u3093\u3066\u30fb\u30fb\u30fb\u3044\u306a\u3044\u3067\u3057\u3087\uff1f<br>\uff08\u898b\u305f\u3053\u3068\u7121\u3044\u3088\u5b9f\u52d9\u3067\uff09<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u3059\u306e\u3067\u3001\u9762\u5012\u3067\u306a\u3051\u308c\u3070<a href=\"https:\/\/code.visualstudio.com\/\">VSCode<\/a>\u3068\u3044\u3046\u30bd\u30d5\u30c8\u3092DL&amp;\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u3066\u304f\u3060\u3055\u3044\u3002(\u7121\u6599\u3067\u3059)<br>\u7121\u6599\u3060\u3051\u3069\u304b\u306a\u308a\u512a\u79c0\u3063\u3066\u3044\u3046\u304b\u6700\u5f37\u307e\u3067\u3042\u308b\u306e\u3067\u5b9f\u52d9\u3067\u3082\u4f7f\u3063\u3066\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3068\u65e5\u672c\u8a9e\u3067\u306f\u306a\u304f\u82f1\u8a9e\u3060\u3068\u304a\u3082\u3044\u307e\u3059\u306e\u3067\u3001<br>\u65e5\u672c\u8a9e\u5316\u306e\u4ed5\u65b9\u306e\u8a18\u4e8b\u3092\u8cbc\u3063\u3066\u304a\u304d\u307e\u3059\u3002<br><a href=\"https:\/\/qiita.com\/ntkgcj\/items\/e77331932c7983dea830\">Visual Studio Code [vsCode] \u65e5\u672c\u8a9e\u5316<\/a><br>\u305d\u3093\u306a\u306b\u96e3\u3057\u3044\u624b\u9806\u306f\u7121\u3044\u306e\u3067\u3084\u3063\u3066\u307f\u3066\u304f\u3060\u3055\u3044\u306d\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">2.2\u4f5c\u308b\u305f\u3081\u306e\u6e96\u5099<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">vscode\u306e\u6e96\u5099\u304c\u7d42\u308f\u3063\u305f\u4eba\u306f\u3053\u3053\u304b\u3089\u4e00\u7dd2\u306bhtml\u3092\u4f5c\u3063\u3066\u3044\u304d\u307e\u3057\u3087\u3046<br>\u3082\u3057\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u304c\u3067\u304d\u306a\u304b\u3063\u305f\u5834\u5408\u306f\u4ed5\u65b9\u306a\u3044\u3067\u3059\u304c\u3001<br>windows\u4ed8\u5c5e\u306e\u30e1\u30e2\u5e33\u306a\u3069\u3067\u3084\u3063\u3066\u307f\u3066\u304f\u3060\u3055\u3044\u3002<br>\u4eca\u56de\u306fVSCode\u3067\u306e\u8aac\u660e\u306b\u306a\u308a\u307e\u3059\u306e\u3067\u30e1\u30e2\u5e33\u306e\u3072\u3068\u306f\u9811\u5f35\u3063\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30c7\u30b9\u30af\u30c8\u30c3\u30d7\u3067\u3082\u306a\u3093\u3067\u3082\u826f\u3044\u306e\u3067\u3001\u4f5c\u696d\u7528\u30d5\u30a9\u30eb\u30c0\u3092\u7528\u610f\u3057\u307e\u3057\u3087\u3046\u3002<br>\u30d5\u30a9\u30eb\u30c0\u540d\u306f<br>website\u3084\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u3084\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\uff01\u7b49\u306e\u3088\u3046\u306b\u308f\u304b\u308a\u3084\u3059\u3044<br>\u540d\u524d\u3067\u3042\u308c\u3070\u4f55\u3067\u3082\u826f\u3044\u3067\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"237\" height=\"182\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website2.jpg\" alt=\"\" class=\"wp-image-556\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3093\u306a\u611f\u3058\u3067\u4f5c\u308c\u307e\u3057\u305f\u304b\uff1f<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6b21\u306fVSCode\u306e\u65b9\u306b\u79fb\u308a\u307e\u3059<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">2.3VSCode\u3067\u306e\u64cd\u4f5c<\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"1016\" height=\"773\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode1-1.jpg\" alt=\"\" class=\"wp-image-558\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode1-1.jpg 1016w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode1-1-300x228.jpg 300w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode1-1-768x584.jpg 768w\" sizes=\"(max-width: 1016px) 100vw, 1016px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">VScode\u3092\u958b\u3044\u305f\u3089\u3053\u3093\u306a\u611f\u3058\u306e\u753b\u9762\u304c\u51fa\u3066\u304d\u305f\u304b\u3068\u601d\u3044\u307e\u3059\u3002<br>\u3053\u308c\u304c\u8d77\u52d5\u753b\u9762\u3067\u3059\u3002\u5148\u7a0b\u4f5c\u3063\u305f\u30d5\u30a9\u30eb\u30c0\u3092VScode\u3067\u958b\u304d\u307e\u3059\u306e\u3067<br>\u30c9\u30e9\u30c3\u30b0\u30a2\u30f3\u30c9\u30c9\u30ed\u30c3\u30d7\u3067VScode\u306b\u4e57\u3063\u3051\u308b\u304b\u3001\u5de6\u4e0a\u306e \u30d5\u30a1\u30a4\u30eb <br>\u3068\u3044\u3046\u90e8\u5206\u304b\u3089\u30d5\u30a9\u30eb\u30c0\u3092\u958b\u304f\u3092\u9078\u629e\u3057\u3066\u958b\u304d\u307e\u3057\u3087\u3046<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/i0.wp.com\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode2.jpg?fit=660%2C495&amp;ssl=1\" alt=\"\" class=\"wp-image-559\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode2.jpg 1024w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode2-300x225.jpg 300w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode2-768x576.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u30d5\u30a9\u30eb\u30c0\u3092\u958b\u3044\u305f\u3089\u3053\u306e\u3088\u3046\u306a\u753b\u9762\u306b\u306a\u308a\u3001\u5de6\u5074\u306b\u958b\u3044\u3066\u308b\u30d5\u30a9\u30eb\u30c0\u540d\u304c<br>\u51fa\u3066\u3044\u308b\u30bf\u30d6\u304c\u3042\u308a\u307e\u3059\u306d\uff1f<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/i2.wp.com\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode3.jpg?fit=660%2C495&amp;ssl=1\" alt=\"\" class=\"wp-image-560\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode3.jpg 1024w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode3-300x225.jpg 300w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/vscode3-768x576.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u30de\u30a6\u30b9\u3092\u30db\u30d0\u30fc\u3059\u308b\u3068\u3053\u306e\u3088\u3046\u306a\u30dc\u30bf\u30f3\u304c\u51fa\u307e\u3059\u3002<br>\u5de6\u304b\u3089<br><strong>\u30fb\u65b0\u3057\u3044\u30d5\u30a1\u30a4\u30eb\u306e\u4f5c\u6210<br>\u30fb\u65b0\u3057\u3044\u30d5\u30a9\u30eb\u30c0\u306e\u4f5c\u6210<br>\u30fb\u6700\u65b0\u306e\u8868\u793a\u306b\u66f4\u65b0<br>\u30fb\u3059\u3079\u3066\u6298\u308a\u305f\u305f\u3093\u3067\u8868\u793a\uff08\u30d5\u30a9\u30eb\u30c0\u306a\u3069\u3092\u9589\u3058\u305f\u72b6\u614b\u306b\u306a\u308b\uff09<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u306f index.html \u3068 index.css \u3068 index.js\u3092\u30d5\u30a1\u30a4\u30eb\u3067\u4f5c\u6210\u3057\u307e\u3059\u3002<br>\u306a\u306e\u3067\u3001\u65b0\u3057\u3044\u30d5\u30a1\u30a4\u30eb\u306e\u4f5c\u6210\u3092\u62bc\u3057\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/i1.wp.com\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website_1.jpg?fit=840%2C630&amp;ssl=1\" alt=\"\" class=\"wp-image-639\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website_1.jpg 1024w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website_1-300x225.jpg 300w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website_1-768x576.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u62bc\u3059\u3068\u3001\u3053\u306e\u3088\u3046\u306b\u65b0\u898f\u30d5\u30a1\u30a4\u30eb\u3092\u4f5c\u6210\u306b\u3042\u305f\u3063\u3066\u3001<br>\u540d\u524d\u3092\u6253\u3061\u8fbc\u3080\u3082\u306e\u304c\u51fa\u3066\u304d\u307e\u3059\u3002<br>\u3053\u3053\u306b\u3001\u5148\u7a0b\u306e<br>index.html<br>\u3092\u6253\u3061\u8fbc\u307f\u3001\u4f5c\u3063\u3066\u898b\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"960\" height=\"1040\" src=\"https:\/\/i1.wp.com\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/image-25.png?fit=840%2C910&amp;ssl=1\" alt=\"\" class=\"wp-image-641\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/image-25.png 960w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/image-25-277x300.png 277w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/image-25-768x832.png 768w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/image-25-945x1024.png 945w\" sizes=\"(max-width: 960px) 100vw, 960px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f5c\u6210\u3057\u305f\u3089\u3001\u3053\u3093\u306a\u611f\u3058\u306b\u306a\u308a\u307e\u3057\u305f\u304b\uff1f<br>\u4f5c\u6210\u3057\u305f index.html \u304c\u30bf\u30d6\u3067\u958b\u304b\u308c\u3066\u3044\u308b\u306e\u304c\u5206\u304b\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u3002<br>\u3053\u3053\u306b html \u3092\u4f5c\u6210\u3059\u308b\u8a18\u8ff0\u3092\u66f8\u3044\u3066\u3044\u304f\u308f\u3051\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">index.html\u3092\u4f5c\u6210\u3057\u305f\u306e\u3068\u540c\u69d8\u306b index.css index.js \u3082\u4f5c\u6210\u3057\u3066\u304a\u3044\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">2.4html\u306e\u57fa\u672c\u7684\u306a\u66f8\u304d\u65b9<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u306f html \u306e\u57fa\u672c\u7684\u306a\u8a18\u8ff0\u3092\u66f8\u304d\u307e\u3059\u3002<br>html \u306e\u57fa\u672c\u306f<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;!DOCTYPE html&gt; \n&lt;html&gt;\n  &lt;head&gt;\n  &lt;\/head&gt;\n  &lt;body&gt;\n  &lt;\/body&gt;\n&lt;\/html&gt;<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u3059\u3002<br>\u4e0a\u304b\u3089\u9806\u756a\u306b\u8aac\u660e\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\n\n\u25a0<strong>  &lt;!DOCTYPE html&gt;  <\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">html\u306b\u3082\u5b9f\u306f\u30d0\u30fc\u30b8\u30e7\u30f3\u304c\u3042\u308a\u307e\u3057\u3066\u3001\u6700\u521d\u306b<br>\u3053\u308c\u306f\u3053\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u3067\u4f5c\u3063\u3066\u307e\u3059\u3088\u3002\u3068\u3001\u5ba3\u8a00\u3059\u308b\u3053\u3068\u3067<br>\u30d6\u30e9\u30a6\u30b6\uff08chrome\u3068\u304bfirefox\u3068\u304b\uff09\u304c\u7406\u89e3\u3057\u3001\u305d\u308c\u306b\u3042\u308f\u305b\u3066<br>\u8aad\u307f\u8fbc\u3093\u3067\u304f\u308c\u307e\u3059\u3002<br><br>\u53c2\u8003\u30b5\u30a4\u30c8 :  <strong><a href=\"http:\/\/www.htmq.com\/html5\/doctype.shtml\">&lt;!DOCTYPE html&gt; \u2026\u2026 \u30c9\u30ad\u30e5\u30e1\u30f3\u30c8\u30bf\u30a4\u30d7\u3092\u5ba3\u8a00\u3059\u308b<\/a><\/strong><a href=\"http:\/\/www.htmq.com\/html5\/doctype.shtml\"> <\/a><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u306e\u5834\u5408\u306f html5 \u3067\u4f5c\u6210\u3057\u3066\u3044\u308b\u306e\u3067<br>html5\u3067\u4f5c\u3063\u3066\u307e\u3059\u3088\u3002\u3068\u8a8d\u8b58\u3057\u3066\u8cb0\u3046\u5834\u5408\u306f<br>\u5148\u982d\u306b\u3001  &lt;!DOCTYPE html&gt;   \u3068\u8a18\u8ff0\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u25a0 &lt;html&gt; &#8230; &lt;\/html&gt;<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>&lt;html&gt;<\/strong> \u30bf\u30b0\u3092\u8a18\u8ff0\u3059\u308b\u3053\u3068\u3067 \u3053\u3053\u304b\u3089 html \u306e\u5185\u5bb9\u3092\u66f8\u304f\u3088\uff01\u3068<br>\u5ba3\u8a00\u3057\u3066\u3044\u308b\u306e\u3067\u3059\u3002<br><strong>&lt;\/html&gt;<\/strong>\u306f \u3053\u3053\u307e\u3067\u304c html \u3060\u3088\uff01\u3068\u3044\u3046\u610f\u5473\u3067\u3059\u3002<br>html\u3067\u306f\u57fa\u672c\u7684\u306b&lt;h1&gt;&lt;\/h1&gt; \u3060\u3063\u305f\u308a &lt;p&gt;&lt;\/p&gt;<br>\u306e\u3088\u3046\u306b\u59cb\u3081\u3068\u7d42\u308f\u308a\u3092\u8a18\u8ff0\u3057\u307e\u3059\u3002<br>\u53c2\u8003\u30b5\u30a4\u30c8 : <a href=\"http:\/\/www.htmq.com\/html\/html.shtml\"> <\/a><strong><a href=\"http:\/\/www.htmq.com\/html\/html.shtml\">&lt;HTML&gt; \u2026\u2026 HTML\u6587\u66f8\u3067\u3042\u308b\u3053\u3068\u3092\u5ba3\u8a00\u3059\u308b<\/a><\/strong><a href=\"http:\/\/www.htmq.com\/html\/html.shtml\"> <\/a><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3061\u306a\u307f\u306b\u5148\u7a0b\u3082\u8cbc\u3063\u305f\u53c2\u8003\u30b5\u30a4\u30c8\u306e\u30ea\u30f3\u30af\u3067\u3059\u304c\u3001<br>\u5b9f\u52d9\u3067\u3082\u304b\u306a\u308a\u304a\u4e16\u8a71\u306b\u306a\u3063\u3066\u308b\u30b5\u30a4\u30c8\u3067\u3001html\u3067\u4f7f\u7528\u3059\u308b<br>\u30bf\u30b0\u3092\u8abf\u3079\u308b\u3068\u304d\u306f <a href=\"http:\/\/www.htmq.com\/\">\u5148\u7a0b\u306e\u30b5\u30a4\u30c8<\/a> \u3067\u8abf\u3079\u308b\u306e\u3092\u30aa\u30b9\u30b9\u30e1\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u25a0 &lt;head&gt;&#8230;&lt;\/head&gt;<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>&lt;head&gt;<\/strong> \u306f \u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u306e\u30bf\u30a4\u30c8\u30eb<br>\uff08\u3053\u306e\u30d6\u30ed\u30b0\u3060\u3063\u305f\u3089\u3000\u30a2\u30b6\u30e9\u30b7\u5099\u5fd8\u9332\uff09<br>\u3084\u3001\u30b5\u30a4\u30c8\u306e\u7c21\u5358\u306a\u8aac\u660e\u3002<br>\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u306e\u8aad\u307f\u8fbc\u307f\u306e\u8a18\u8ff0\u3002<br>\u306a\u3069\u3001\u30b5\u30a4\u30c8\u306e\u60c5\u5831\u306b\u95a2\u308f\u308b\u8a18\u8ff0\u3092\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u53c2\u8003\u30b5\u30a4\u30c8 :  <strong><a href=\"http:\/\/www.htmq.com\/html\/head.shtml\">&lt;HEAD&gt; \u2026\u2026 \u6587\u66f8\u306e\u30d8\u30c3\u30c0\u60c5\u5831\u3092\u8868\u3059<\/a><\/strong><a href=\"http:\/\/www.htmq.com\/html\/head.shtml\"> <\/a><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u25a0 &lt;body&gt;&#8230;&lt;\/body&gt;<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>&lt;body&gt;<\/strong> \u306e\u4e2d\u306b\u306f\u3001web\u30b5\u30a4\u30c8\u306e\u6587\u7ae0\u3060\u3063\u305f\u308a\u3001<br>\u753b\u50cf\u3060\u3063\u305f\u308a\u3001\u52d5\u753b\u3060\u3063\u305f\u308a\u30fb\u30fb\u30fb<br>\u3064\u307e\u308a\u3053\u3053\u304c\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u3092\u69cb\u6210\u3057\u3066\u3044\u308b<br>\u4e2d\u8eab\u3092\u8a18\u8ff0\u3059\u308b\u90e8\u5206\u3067\u3059\u306d\u3002<br>\u30b5\u30a4\u30c8\u3092\u4f5c\u308b\u4e0a\u3067\u306f\u3053\u3053\u306b\u3044\u308d\u3044\u308d\u3068<br>\u8a18\u8ff0\u3057\u3066\u3044\u304f\u306e\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4e0a\u8a18\u306e\u30bf\u30b0\u305f\u3061\u304chtml\u3092\u4f5c\u308b\u4e0a\u3067<br>\u5fc5\u8981\u4e0d\u53ef\u6b20\u306a\u3082\u306e\u306b\u306a\u308a\u307e\u3059\u3002<br>\u3068\u3044\u3046\u304b\u3001\u30b3\u30ec\u3092\u304b\u3051\u3070\u3001\u30d6\u30e9\u30a6\u30b6\u3067\u8868\u793a\u3059\u308b\u3053\u3068\u306f<br>\u3059\u3067\u306b\u53ef\u80fd\u306a\u306e\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3068\u308a\u3042\u3048\u305a\u3001\u5148\u7a0b\u306e\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3092<br>\u4f5c\u6210\u3057\u305f index.html \u306b\u8a18\u8ff0\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"532\" height=\"289\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website_2.jpg\" alt=\"\" class=\"wp-image-643\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website_2.jpg 532w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/05\/website_2-300x163.jpg 300w\" sizes=\"(max-width: 532px) 100vw, 532px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3093\u306a\u611f\u3058\u3002\u3061\u306a\u307f\u306b\u4f55\u304b\u30d5\u30a1\u30a4\u30eb\u306b\u5909\u66f4\u3092\u52a0\u3048\u305f\u3089<br>ctrl + s (mac\u306a\u3089 \u2318 + s \u3060\u3063\u3051)\u3067\u4fdd\u5b58\u3059\u308b\u306e\u3092\u5fd8\u308c\u305a\u306b\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4fdd\u5b58\u3057\u305f\u3089 index.html \u306e\u898b\u305f\u76ee\u304c\u3061\u3087\u3063\u3068\u5909\u308f\u3063\u3061\u3083\u3063\u305f\uff01\u3068\u3044\u3046\u4eba\u3002\u591a\u5206\u30a4\u30f3\u30c7\u30f3\u30c8(\u30b9\u30da\u30fc\u30b9\u3084\u30bf\u30d6\u306b\u3088\u308b\u968e\u5c64\u3068\u3044\u3046\u304b\u6bb5\u5dee\u3068\u3044\u3046\u304b)\u304c\u5909\u66f4\u3055\u308c\u308b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u8a2d\u5b9a\u306e\u5909\u66f4\u306a\u3069\u306f<br>\u53c2\u8003\u30b5\u30a4\u30c8 : <a href=\"https:\/\/qiita.com\/rubytomato@github\/items\/d4716c41a2d15c64f791\">Visual Studio Code\u306ehtml\u30d5\u30a9\u30fc\u30de\u30c3\u30bf\u30fc\u306e\u30e1\u30e2<\/a><br>\u306b\u8a73\u3057\u304f\u4e57\u3063\u3066\u3044\u307e\u3059\u306e\u3067\u3001\u53c2\u8003\u30b5\u30a4\u30c8\u69d8\u3092\u53c2\u8003\u306b<br>\u3057\u3066\u3044\u305f\u3060\u3044\u305f\u65b9\u304c\u3044\u3044\u304b\u3068\u601d\u3044\u307e\u3059\u306e\u3067\u3001\u305d\u3061\u3089\u3067\u304a\u9858\u3044\u3044\u305f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">3.\u5b9f\u969b\u306b\u8a18\u8ff0\u3057\u3066\u3044\u3053\u3046\uff01<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u57fa\u672c\u7684\u306b\u8a18\u8ff0\u3059\u308b\u3082\u306e\u306f\u7406\u89e3\u3057\u3066\u3082\u3089\u3048\u305f\u304b\u3068\u601d\u3044\u307e\u3059\u3002<br>\u3057\u304b\u3057\u3001\u3053\u306e\u307e\u307e\u3067\u306f\u306a\u306b\u3082\u306a\u3044\u30b5\u30a4\u30c8\u304c\u8868\u793a\u3055\u308c\u308b\u3060\u3051\u3067\u3059\u3002<br>\u3053\u3053\u304b\u3089\u5fc5\u8981\u306a\u3082\u306e\u3092\u8a18\u8ff0\u3057\u3066\u3044\u304d\u307e\u3057\u3087\u3046\uff01<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3068\u308a\u3042\u3048\u305a\u307e\u305a\u306f\u6587\u5b57\u3092\u8868\u793a\u3055\u305b\u3066\u5b9f\u969b\u306b\u8a18\u8ff0\u3057\u305f\u3082\u306e\u304c<br>\u53cd\u6620\u3055\u308c\u3066\u3001\u306a\u306b\u304b\u51fa\u6765\u305f\u611f\u3092\u5473\u308f\u3063\u3066\u884c\u304d\u307e\u3057\u3087\u3046\u3002<br>\u3053\u306e\u3088\u3046\u306b\u8a18\u8ff0\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"708\" height=\"488\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-1.png\" alt=\"\" class=\"wp-image-724\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-1.png 708w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-1-300x207.png 300w\" sizes=\"(max-width: 708px) 100vw, 708px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">&lt;body&gt;&#8230;&lt;\/body&gt;<br>\u306e\u9593\u306b<br>&lt;p&gt;\u3053\u3093\u306b\u3061\u306f\uff01&lt;\/p&gt;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3068\u8a18\u8ff0\u3057\u307e\u3057\u305f\u3002<br>&lt;p&gt;\u306fparagraph\u306e\u610f\u5473\u3067 \u6bb5\u843d \u3092\u8868\u3057\u307e\u3059\u3002<br>\u53c2\u8003\u30b5\u30a4\u30c8 :  <strong><a href=\"http:\/\/www.htmq.com\/html\/p.shtml\">&lt;P&gt; \u2026\u2026 \u3072\u3068\u3064\u306e\u6bb5\u843d\uff08\u30d1\u30e9\u30b0\u30e9\u30d5\uff09\u3067\u3042\u308b\u3053\u3068\u3092\u8868\u3059<\/a><\/strong><a href=\"http:\/\/www.htmq.com\/html\/p.shtml\"> <\/a><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u57fa\u672c\u7684\u306b\u6587\u5b57\u3092\u5165\u308c\u308b\u6642\u306f p \u30bf\u30b0\u3092\u4f7f\u3063\u3066\u5165\u308c\u308b\u3053\u3068\u304c\u591a\u3044\u3067\u3059\u3002<br>\uff08\u4e00\u5fdc\u4ed6\u306e\u30bf\u30b0\u3067\u5165\u308c\u308b\u3053\u3068\u3082\u3042\u308a\u307e\u3059\u304c\u3001\u57fa\u672c\u3068\u3057\u3066\u306f p \u30bf\u30b0\u3067\u3059\u3002\uff09<br>\u3067\u306f\u3001\u3053\u306e\u72b6\u614b\u3067\u30d6\u30e9\u30a6\u30b6\u3067\u8868\u793a\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30d6\u30e9\u30a6\u30b6\u3067\u8868\u793a\u3059\u308b\u306b\u306fChrome\u3084FireFox\u306b\u4eca\u56de\u4f5c\u6210\u3057\u3066\u3044\u308b<br>index.html\u3092\u958b\u304d\u307e\u3059\u3002\u958b\u304f\u306b\u306fChrome\u3084FireFox\u306b<br>index.hmtl\u3092\u30c9\u30e9\u30c3\u30af\u30a2\u30f3\u30c9\u30c9\u30ed\u30c3\u30d7\u3059\u308b\u3053\u3068\u3067\u958b\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u306f\u65e9\u901f\u3084\u3063\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"1007\" height=\"1048\" src=\"https:\/\/i2.wp.com\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/website_3.jpg?fit=840%2C874&amp;ssl=1\" alt=\"\" class=\"wp-image-726\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/website_3.jpg 1007w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/website_3-288x300.jpg 288w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/website_3-768x799.jpg 768w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/website_3-984x1024.jpg 984w\" sizes=\"(max-width: 1007px) 100vw, 1007px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3093\u306a\u611f\u3058\u3067\u8868\u793a\u3055\u308c\u307e\u3057\u305f\uff01<br>\u5148\u7a0b\u3001p\u30bf\u30b0\u3067\u5165\u308c\u305f \u3053\u3093\u306b\u3061\u306f\uff01\u304c\u3057\u3063\u304b\u308a\u3068\u8868\u793a\u3055\u308c\u3066\u3044\u307e\u3059\u306d\u3002<br>\u4f55\u304b\u3057\u3089\u3067\u304d\u305f\u611f\u899a\u306f\u5473\u308f\u3048\u305f\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3057\u304b\u3057\u3001\u3053\u308c\u3060\u3051\u3067\u306fweb\u30b5\u30a4\u30c8\u304c\u3067\u304d\u305f\uff01\u3068\u306f\u3044\u3044\u3065\u3089\u3044\u3067\u3059\u3088\u306d\u3002<br>\u6587\u5b57\u306e\u30b5\u30a4\u30ba\u3084\u8272\u3092\u5909\u3048\u305f\u308a\u3001\u753b\u50cf\u3092\u8868\u793a\u3055\u305b\u305f\u308a\u30fb\u30fb\u30fb<br>\u8272\u3005\u3057\u305f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u3001css\u304c\u51fa\u3066\u304d\u307e\u3059\u3002<br>css\u3067\u6587\u5b57\u306e\u30b5\u30a4\u30ba\u306a\u3069\u3092\u6307\u5b9a\u3057\u3066\u3042\u3052\u308b\u3053\u3068\u3067\u30b5\u30a4\u30ba\u304c\u5909\u308f\u3063\u305f\u308a<br>\u6587\u5b57\u8272\u3092\u5909\u66f4\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">3.1 css\u3092\u4f7f\u3063\u3066\u307f\u3088\u3046<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">html\u3067css\u3092\u4f7f\u3048\u308b\u3088\u3046\u306b\u3059\u308b\u306b\u306f\u3001html\u5074\u3067css\u3092\u8aad\u307f\u8fbc\u3080\u8a18\u8ff0\u3092<br>\u66f8\u304b\u306a\u3051\u308c\u3070\u3044\u3051\u307e\u305b\u3093\u3002<br>\u306a\u306e\u3067\u3001\u305d\u306e\u8a18\u8ff0\u3092html\u8a18\u8f09\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u8a18\u8f09\u3059\u308b\u8a18\u8ff0\u306f<br> &lt;link rel=&#8221;stylesheet&#8221; type=&#8221;text\/css&#8221; href=&#8221;.\/index.css&#8221;&gt; <br>\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">3.1.1 link\u8981\u7d20\u306b\u3064\u3044\u3066<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">\u53c2\u8003\u30b5\u30a4\u30c8 : <a href=\"https:\/\/www.tagindex.com\/html_tag\/page\/link_style.html\">\u5916\u90e8\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u3092\u8aad\u307f\u8fbc\u3080<\/a><br>&lt;link&gt;\u3068\u3044\u3046\u30bf\u30b0\u304c\u305d\u3082\u305d\u3082\u3042\u308a\u307e\u3057\u3066\u3001\u305d\u306e\u5c5e\u6027\u306b<br>\u8272\u3005\u4ed8\u3051\u52a0\u3048\u308b\u3053\u3068\u3067\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u3092\u8aad\u307f\u8fbc\u3093\u3067\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">link\u3068\u3044\u3046\u8981\u7d20\u306b\u3064\u3044\u3066\u898b\u3066\u307f\u307e\u3057\u3087\u3046\u3002<br>\u53c2\u8003\u30b5\u30a4\u30c8 : <a href=\"https:\/\/www.tagindex.com\/html_tag\/elements\/link.html\">link \u8981\u7d20<\/a><br>\u4e0a\u8a18\u30b5\u30a4\u30c8\u306e\u4e2d\u306b\u5c5e\u6027\u4e00\u89a7\u3068\u3044\u3046\u9805\u76ee\u304c\u3042\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u3092\u8aad\u307f\u8fbc\u3080\u306b\u3042\u305f\u3063\u3066\u4f7f\u3063\u3066\u3044\u308b\u3082\u306e\u306f<br>rel , type , href<br>\u3067\u3059\u306d\u3002\u3053\u308c\u3089\u306b\u3064\u3044\u3066\u5c11\u3005\u8aac\u660e\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">3.1.2 rel\u5c5e\u6027\u306b\u3064\u3044\u3066<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">rel : \u3053\u306e\u6587\u66f8\u304b\u3089\u898b\u305f\uff08index.html\uff09\u30ea\u30f3\u30af\u5148(index.css)\u306e\u95a2\u4fc2<br>index.html\u3067\u8aad\u307f\u8fbc\u3080\u306b\u3042\u305f\u3063\u3066\u3053\u308c\u306f\u306a\u3093\u306e\u30d5\u30a1\u30a4\u30eb\u306a\u306e\uff1f<br>\u3068\u3044\u3046\u306e\u3092\u66f8\u3044\u3066\u4e0a\u3052\u308b\u3053\u3068\u3067\u3001css\u3068\u3057\u3066\u8aad\u307f\u8fbc\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u306a\u306e\u3067<br>rel=&#8221;stylesheet&#8221;<br>\u3068\u8a18\u8ff0\u3059\u308b\u3053\u3068\u3067 css \u306a\u3093\u3060\u306d\u3002\u3068\u8a8d\u8b58\u3057\u3066\u304f\u308c\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">3.1.3 type\u5c5e\u6027\u306b\u3064\u3044\u3066<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">type : \u30ea\u30f3\u30af\u5148\u306eMIME\u30bf\u30a4\u30d7<br>MIME\u30bf\u30a4\u30d7\u3068\u8a00\u308f\u308c\u3066\u3082\u6b63\u76f4\u3088\u304f\u308f\u304b\u3089\u306a\u3044\u3067\u3059\u3088\u306d\u3002<br>\u3053\u308c\u306f\u305d\u306e\u30d5\u30a1\u30a4\u30eb\u304c\u3069\u3046\u3044\u3046\u30d5\u30a1\u30a4\u30eb\u3067\u3042\u308b\u304b\uff1f\u3068\u3044\u3046\u4e8b\u3092\u8a18\u8ff0\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u53c2\u8003\u30b5\u30a4\u30c8 : <a href=\"https:\/\/www.tagindex.com\/html_tag\/basic\/mimetype.html\">MIME\u30bf\u30a4\u30d7<\/a><br>MIME\u30bf\u30a4\u30d7\u306f\u30d6\u30e9\u30a6\u30b6\u3068\u30b5\u30fc\u30d0\u30fc\u3067\u30d5\u30a1\u30a4\u30eb\u3092\u3084\u308a\u53d6\u308a\u3059\u308b\u969b\u306b<br>\u30d6\u30e9\u30a6\u30b6\u5074\u306fMIME\u30bf\u30a4\u30d7\u3092\u307f\u3066\u51e6\u7406\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u306a\u306e\u3067\u3001\u62e1\u5f35\u5b50\u3067 .jpg \u3084 .css \u3068\u66f8\u304f\u3060\u3051\u3067\u753b\u50cf\u3084\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u3067\u3042\u308b\u3068<br>\u8a8d\u8b58\u3057\u3066\u3044\u308b\u308f\u3051\u3067\u306f\u306a\u304f\u3001MIME\u30bf\u30a4\u30d7\u3092\u53c2\u8003\u306b\u3057\u3066\u3044\u308b\u308f\u3051\u3067\u3059\u3002<br>\u4f8b\u3048\u3070\u305f\u3060\u306e\u30c6\u30ad\u30b9\u30c8\u30d5\u30a1\u30a4\u30eb\u306e\u5834\u5408\u306f\u4e0a\u8a18\u306e\u30ea\u30f3\u30af\u3092\u53c2\u8003\u306b\u3059\u308b\u3068<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u62e1\u5f35\u5b50\u306f .txt \u3067\u3059\u304c\u3001MIME\u30bf\u30a4\u30d7\u306f<br>text\/plain<br>\u3068\u306a\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">text\/plain \u306f\u5de6\u304c\u30bf\u30a4\u30d7\u540d\u3001\u53f3\u304c\u30b5\u30d6\u30bf\u30a4\u30d7\u540d\u3068\u3044\u3046\u898f\u5247\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u304c\u3001<br>\u5de6\u304c\u5927\u30b0\u30eb\u30fc\u30d7\u3067\u53f3\u304c\u5c0f\u30b0\u30eb\u30fc\u30d7\u3068\u3057\u3066\u304a\u307c\u3048\u3066\u304a\u3051\u3070\u5927\u4e08\u592b\u3067\u3059\u3002<br>\u306a\u306e\u3067\u3001text\/plain \u3067\u8aac\u660e\u3057\u307e\u3059\u3068\u3001<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30c6\u30ad\u30b9\u30c8\uff08\u4eba\u9593\u304c\u7406\u89e3\u3067\u304d\u308b\u6587\u7ae0\uff09\u306e\u5927\u30b0\u30eb\u30fc\u30d7\u306b\u6240\u5c5e\u3057\u3066\u3044\u308b<br>\u30d7\u30ec\u30fc\u30f3\uff08\u5e73\u6587\uff09\u3067\u3059\u3088\u3002\u3068\u3044\u3046\u3053\u3068\u3067\u3059\u3002<br>\u3053\u306e\u7406\u5c48\u3067\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u306e text\/css \u3092\u8aad\u307f\u89e3\u304f\u3068<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30c6\u30ad\u30b9\u30c8\uff08\u4eba\u9593\u304c\u7406\u89e3\u3067\u304d\u308b\u6587\u7ae0\uff09\u306e\u5927\u30b0\u30eb\u30fc\u30d7\u306b\u6240\u5c5e\u3057\u3066\u3044\u308b<br>\u30ab\u30b9\u30b1\u30fc\u30c7\u30a3\u30f3\u30b0\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\uff08css\uff09\u3067\u3059\u3088\u3002<br>\u3068\u3044\u3046\u3053\u3068\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u3088\u3046\u306a\u8a18\u8f09\u3092\u3059\u308b\u3053\u3068\u3067\u3001\u30d6\u30e9\u30a6\u30b6\u5074\u306fweb\u30b5\u30a4\u30c8\u306e\u30c7\u30fc\u30bf\u3092<br>\u30b5\u30fc\u30d0\u30fc\u304b\u3089\u53d6\u5f97\u3059\u308b\u969b\u306b\u3001MIME\u30bf\u30a4\u30d7\u3092\u78ba\u8a8d\u3057\u3066<br>\u6b63\u3057\u304f\u5229\u7528\u3057\u3066\u3044\u308b\u3068\u3044\u3046\u3053\u3068\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">3.1.4 href\u5c5e\u6027\u306b\u3064\u3044\u3066<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">href\u306b\u306f\u3001\u30d5\u30a1\u30a4\u30eb\u306e\u5834\u6240\u3084\u30ea\u30f3\u30af\u5148\u3092\u8a18\u8ff0\u3057\u307e\u3059\u3002<br>\u8a18\u8ff0\u3059\u308b\u3082\u306e\u306f URI \u3068\u547c\u3070\u308c\u308b\u3082\u306e\u3067\u3059\u3002<br>\u3048\u3001URL\u3058\u3083\u306a\u3044\u306e\uff1f\u3068\u601d\u308f\u308c\u308b\u304b\u3082\u77e5\u308c\u306a\u3044\u306e\u3067\u9055\u3044\u3092\u66f8\u3044\u3066\u7f6e\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">3.1.4-1 URI\u306b\u3064\u3044\u3066<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">URI\u306f URL , URN\u3092\u307e\u3068\u3081\u305f\u7269\u306e\u8a00\u3044\u65b9\u3067\u3059\u3002<br>URL\u3068\u3044\u3046\u306e\u306f web\u4e0a\u3067\u306e\u4f4f\u6240\uff08\u30a2\u30c9\u30ec\u30b9\uff09\u3067<br>URN\u306f\u540d\u524d\uff08\u30b5\u30a4\u30c8\u540d\uff09\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305f\u3060\u30a6\u30a7\u30d6\u30b5\u30a4\u30c8\u3092\u4f5c\u308a\u305f\u3044\uff01\u3068\u3044\u3046\u3060\u3051\u306a\u3089\u5fc5\u8981\u3067\u306f\u7121\u3044\u304b\u3082\u77e5\u308c\u307e\u305b\u3093\u304c<br>\u77e5\u3063\u3066\u304a\u3051\u3070\u3001URI\u30fb\u30fb\u30fb\uff1fURL\u3058\u3083\u306a\u3044\u306e\u304b\uff1f<br>\u3068\u7591\u554f\u306b\u601d\u3063\u3066\u8e93\u3044\u3066\u3057\u307e\u3046\u3053\u3068\u304c\u306a\u304f\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u306a\u306e\u3067\u3001\u305d\u3093\u306a\u3053\u3068\u3082\u3042\u3063\u305f\u306a\u3002<br>\u3050\u3089\u3044\u306b\u982d\u306e\u7247\u9685\u3067\u304a\u307c\u3048\u3066\u304a\u3044\u3066\u8cb0\u3048\u308c\u3070\u3001<br>\u4f55\u304b\u3042\u3063\u305f\u6642\u306b\u5f79\u7acb\u3064\u304b\u3082\u77e5\u308c\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">3.1.5 \u65e9\u901fCSS\u3092\u66f8\u3053\u3046<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">\u5927\u5206\u9577\u304f\u306a\u3063\u3066\u3057\u307e\u3044\u307e\u3057\u305f\u304c\u3001\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u3092<br>\u8aad\u307f\u8fbc\u3080\u8a18\u8ff0\u3092\u66f8\u304d\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"916\" height=\"412\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-5.png\" alt=\"\" class=\"wp-image-731\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-5.png 916w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-5-300x135.png 300w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-5-768x345.png 768w\" sizes=\"(max-width: 916px) 100vw, 916px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">&lt;head&gt;&#8230;&lt;\/head&gt;\u306e\u9593\u306b\u3001\u5148\u7a0b\u306e\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u306e\u8a18\u8ff0\u3092\u66f8\u304d\u307e\u3057\u305f\u3002<br>\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u306e\u8aad\u307f\u8fbc\u307f\u306a\u3069\u306fhead\u5185\u306b\u8a18\u8ff0\u3057\u307e\u3059\u3002<br>\u3053\u308c\u3067index.css\u306f\u8aad\u307f\u8fbc\u307e\u308c\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3057\u304b\u3057\u3001index.css\u306e\u65b9\u306b\u306f\u307e\u3060\u4f55\u3082\u8a18\u8ff0\u3057\u3066\u3044\u306a\u3044\u306e\u3067\u3001<br>\u4f55\u3082\u8d77\u3053\u3089\u306a\u3044\u304b\u3068\u601d\u3044\u307e\u3059\u3002\u3067\u3059\u306e\u3067\u3001<br>\u3053\u3053\u304b\u3089\u306f index.css \u306b\u30b9\u30bf\u30a4\u30eb\u306e\u8a18\u8ff0\u3092\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"916\" height=\"412\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-6.png\" alt=\"\" class=\"wp-image-732\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-6.png 916w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-6-300x135.png 300w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/image-6-768x345.png 768w\" sizes=\"(max-width: 916px) 100vw, 916px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">index.css\u3092\u958b\u304d\u3001\u3053\u306e\u3088\u3046\u306b\u8a18\u8ff0\u3057\u307e\u3057\u305f\u3002<br>\u8a18\u8ff0\u3057\u305f\u5185\u5bb9\u306f<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">p { <br>    font-size : 20px;<br> }<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306f\u3001 p \u30bf\u30b0\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\uff08\u6587\u5b57\u30b5\u30a4\u30ba\uff09\u309220px\u306e\u30b5\u30a4\u30ba\u306b\u5909\u66f4\u3057\u307e\u3059\u3002<br>\u3068\u3044\u3046\u8a18\u8ff0\u3067\u3059\u3002\u3053\u306e\u72b6\u614b\u3067\u3001\u5148\u7a0b\u306eindex.html\u3092\u958b\u3044\u3066\u3044\u308b\u30d6\u30e9\u30a6\u30b6\u3092<br>\u518d\u8aad\u307f\u8fbc\u307f\u3059\u308c\u3070\u3001\u5909\u5316\u304c\u3042\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"1007\" height=\"621\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/website_4.jpg\" alt=\"\" class=\"wp-image-733\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/website_4.jpg 1007w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/website_4-300x185.jpg 300w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/07\/website_4-768x474.jpg 768w\" sizes=\"(max-width: 1007px) 100vw, 1007px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u6587\u5b57\u306e\u30b5\u30a4\u30ba\u304c\u5927\u304d\u304f\u306a\u308a\u307e\u3057\u305f\u306d\uff01<br>\u3053\u308c\u3067\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8\u304c\u53cd\u6620\u3055\u308c\u3066\u3044\u308b\u306e\u304c<br>\u78ba\u8a8d\u3067\u304d\u305f\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u306f\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306e\u5909\u66f4\u3067\u3057\u305f\u304c\u3001<br>\u4ed6\u306b\u3082\u6587\u5b57\u306e\u8272\u3092\u5909\u3048\u305f\u308a\u3001\u30d5\u30a9\u30f3\u30c8\u3092\u5909\u3048\u305f\u308a<br>css\u3067\u8981\u7d20\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u6574\u3048\u305f\u308a\u3057\u307e\u3059\u3002<br>\u4ed6\u306e\u7528\u9014\u306b\u3064\u3044\u3066\u306f\u69d8\u3005\u306a\u8a18\u4e8b\u3092\u66f8\u3044\u3066\u308b\u4eba\u304c\u661f\u306e\u6570\u307b\u3069\u3044\u307e\u3059\u306e\u3067<br><strong>css \u4f7f\u3044\u65b9<\/strong><br>\u306a\u3069\u3067\u8abf\u3079\u3066\u307f\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3068\u3044\u3046\u306e\u3082\u3001\u4e00\u822c\u7684\u306b\u3088\u304f\u4f7f\u3046CSS\u306e\u8a18\u8ff0\u3092\u5168\u3066\u8aac\u660e\u3057\u3066\u3044\u308b\u3068<br>\u3068\u3093\u3067\u3082\u306a\u304f\u9577\u304f\u306a\u3063\u3066\u3057\u307e\u3046\u304b\u3089\u3067\u3059\u3002<br>\u3067\u3059\u306e\u3067\u3001\u8a73\u3057\u304f\u66f8\u3044\u3066\u3042\u308b\u30ea\u30d5\u30a1\u30ec\u30f3\u30b9\u30b5\u30a4\u30c8\u306a\u3069\u3067<br>\u4f7f\u3044\u305f\u3044\u6a5f\u80fd\u3092\u8abf\u3079\u308b\u7656\u3092\u3064\u3051\u308b\u306e\u304c\u30aa\u30b9\u30b9\u30e1\u3067\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">3.2 JavaScript\u3092\u66f8\u3044\u3066\u307f\u3088\u3046<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u6b21\u306fJavaScript\u306e\u66f8\u304d\u65b9\u3001\u3068\u3044\u3046\u304b\u3053\u3046\u3057\u305f\u3089JavaScript\u304c\u52d5\u304f\u3088\uff01<br>\u3068\u3044\u3046\u8aac\u660e\u3092\u8a18\u8ff0\u3057\u3066\u3044\u304d\u307e\u3059\u3002<br>JavaScript\u306b\u95a2\u3057\u3066\u3082Web\u30b5\u30a4\u30c8\u3092\u4f5c\u308b\u4e0a\u3067\u3001\u3042\u308c\u304c\u3084\u308a\u305f\u3044\u3001\u3053\u308c\u304c<br>\u3084\u308a\u305f\u3044\u7b49\u306e\u8003\u3048\u304c\u51fa\u3066\u3001\u3053\u308c\u306fCSS\u3084html\u3058\u3083\u3067\u304d\u306a\u3044\u306a\u3044\u306a\u3002<br>\u3058\u3083\u3042JavaScript\u4f7f\u304a\u3046\uff01\u3068\u3044\u3046\u6d41\u308c\u306b\u306a\u308b\u306f\u305a\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u306a\u306e\u3067\u3001\u4eca\u56de\u306f\u30dc\u30bf\u30f3\u8981\u7d20\u3092\u7528\u610f\u3057\u3066\u3001\u30af\u30ea\u30c3\u30af\u3057\u305f\u3089<br>\u4f55\u304b\u53cd\u5fdc\u304c\u3042\u308b\u3088\u3046\u306aJS\u3092\u8a18\u8ff0\u3057\u3066\u307f\u305f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f5c\u6210\u3057\u3066\u304a\u3044\u305fJavaScript\u30d5\u30a1\u30a4\u30eb\u3092html\u5074\u3067\u8aad\u307f\u8fbc\u3080\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u306e\u3067\u3001<br>html\u5074\u306b\u8aad\u307f\u8fbc\u3080\u8a18\u8ff0\u3092\u8a18\u8f09\u3057\u307e\u3059\u3002<br>&lt;\/html&gt;\u306e\u4e00\u884c\u524d\u306b\u66f8\u304d\u306e\u8a18\u8ff0\u3092\u8a18\u8f09\u3057\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"> &lt;script&nbsp;type=\"text\/javascript\"&nbsp;src=\"index.js\"&gt;&lt;\/script&gt; <\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">&lt;head&gt;&lt;\/head&gt;\u306e\u9593\u306b\u5165\u308c\u308b\u3093\u3058\u3083\u306a\u3044\u306e\uff1f\u3068\u601d\u3063\u305f\u65b9\u3082\u5c45\u308b\u304b\u3082\u3057\u308c\u307e\u305b\u3093\u3002<br>\u78ba\u304b\u306b\u3001\u5148\u306b\u8aad\u307f\u8fbc\u3093\u3060\u307b\u3046\u304c\u3044\u3044\u5834\u5408\u3082\u3042\u308a\u307e\u3059\u304c\u3001<br>\u4eca\u56de\u306fhtml\u306e\u8981\u7d20\u306b\u5bfe\u3057\u3066js\u3092\u4f7f\u3046\u306e\u3067\u3001html\u304c\u3057\u3063\u304b\u308a\u751f\u6210\u3055\u308c\u3066\u304b\u3089\u3058\u3083\u306a\u3044\u3068\u3001js\u5074\u3067\u8981\u7d20\u3092\u53d6\u5f97\u3067\u304d\u307e\u305b\u3093\u3002\u3067\u3059\u306e\u3067\u3001&lt;\/html&gt;\u306e\uff11\u884c\u524d\u306b\u8a18\u8f09\u3057\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u3067\u3001index.js\u3092\u8aad\u307f\u8fbc\u3080\u8a2d\u5b9a\u304c\u3067\u304d\u307e\u3057\u305f\u3002<br>\u4eca\u56de\u306f\u30dc\u30bf\u30f3\u3092\u30af\u30ea\u30c3\u30af\u3055\u305b\u308b\u306e\u3067\u3001\u30dc\u30bf\u30f3\u8981\u7d20\u3092\u7528\u610f\u3057\u307e\u3057\u3087\u3046\u3002<br>index.html\u306e&lt;body&gt;&lt;\/body&gt;\u306e\u9593\u306b\u3053\u306e\u3088\u3046\u306a\u884c\u3092\u8ffd\u52a0\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"> &lt;button id=\"button\"&gt;\u62bc\u3057\u3066\u306d\uff01&lt;\/button&gt; <\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">&lt;p&gt;\u3053\u3093\u306b\u3061\u306f!&lt;\/p&gt;\u306e\u4e0b\u306e\u884c\u306b\u81ea\u5206\u306f\u8ffd\u52a0\u3057\u307e\u3057\u305f\u3002<br>VSCode\u3067\u306e\u898b\u305f\u76ee\u3060\u3068\u3053\u306e\u3088\u3046\u306a\u611f\u3058\u306b\u306a\u3063\u3066\u3044\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">button \u306e\u5f8c\u306b\u8a18\u8ff0\u3057\u3066\u3044\u308b id=&#8221;button&#8221;\u3067\u3059\u304c\u3001<br>\u8981\u7d20\u306b\u3064\u3051\u308b\u3053\u3068\u3067\u56fa\u6709\u306e\u8981\u7d20\u3068\u3057\u3066\u4f7f\u3046\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<br>\u540d\u524d\u306b\u95a2\u3057\u3066\u306f\u308f\u304b\u308a\u3084\u3059\u3051\u308c\u3070\u57fa\u672c\u306f\u4f55\u3067\u3082\u3044\u3044\u3067\u3059\u304c\u3001<br>ID\u306b\u3064\u3051\u3089\u308c\u308b\u540d\u524d\u306f\u88ab\u3063\u3066\u306f\u3044\u3051\u307e\u305b\u3093\u3002<br>\u306a\u306e\u3067\u3001button\u3068\u3044\u3046ID\u3092\u3064\u3051\u305f\u3089\u3001\u305d\u306e\u8981\u7d20\u4ee5\u5916\u3067\u306f\u305d\u306eID\u540d\u306f<br>\u4f7f\u3063\u3066\u306f\u3044\u3051\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"659\" height=\"402\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website.jpg\" alt=\"\" class=\"wp-image-789\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website.jpg 659w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website-300x183.jpg 300w\" sizes=\"(max-width: 659px) 100vw, 659px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u3088\u3046\u306b\u306a\u308a\u307e\u3057\u305f\u304b\uff1f<br>\u3053\u306e\u72b6\u614b\u3067\u4e00\u65e6html\u3092\u30d6\u30e9\u30a6\u30b6\u3067\u958b\u3044\u3066\u898b\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/09\/website_6.jpg\"><img decoding=\"async\" width=\"516\" height=\"528\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/09\/website_6.jpg\" alt=\"\" class=\"wp-image-784\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/09\/website_6.jpg 516w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/09\/website_6-293x300.jpg 293w\" sizes=\"(max-width: 516px) 100vw, 516px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3093\u306b\u3061\u306f\uff01\u306e\u4e0b\u306b\u62bc\u3057\u3066\u306d\uff01\u306e\u30dc\u30bf\u30f3\u304c\u8ffd\u52a0\u3055\u308c\u3066\u3044\u308b\u306e\u304c<br>\u78ba\u8a8d\u3067\u304d\u305f\u3067\u3057\u3087\u3046\u304b\uff1f<br>\u4eca\u3053\u306e\u72b6\u614b\u3067\u30dc\u30bf\u30f3\u3092\u62bc\u3057\u3066\u3082\u7279\u306b\u4f55\u3082\u8d77\u3053\u308a\u307e\u305b\u3093\u3002<br>\u4f55\u304b\u30a2\u30af\u30b7\u30e7\u30f3\u3092\u8d77\u3053\u3059\u305f\u3081\u306bJS\u3067\u8a18\u8ff0\u3092\u66f8\u3044\u3066\u3044\u3053\u3046\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">index.js\u3067\u30dc\u30bf\u30f3\u3092\u30af\u30ea\u30c3\u30af\u3057\u305f\u3068\u304d\u306b\u4f55\u304b\u3059\u308b\u3002\u3068\u3044\u3046\u8a18\u8ff0\u306f<br>\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u8a18\u8ff0\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var target = document.getElementById(\"button\");\ntarget.addEventListener(\"click\",&nbsp;function&nbsp;(e)&nbsp;{\n&nbsp;&nbsp;console.log(\"hoge\");\n}); <\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">document \u3053\u308c\u306fhtml\u8981\u7d20\u3092\u53d6\u5f97\u3059\u308b\u305f\u3081\u306b\u8a18\u8ff0\u3057\u3066\u3044\u307e\u3059\u3002<br>. \u3067\u3064\u306a\u3050\u4e8b\u3067\u305d\u308c\u306b\u95a2\u9023\u3059\u308b\u95a2\u6570\u3092\u547c\u3073\u51fa\u3057\u3066\u3044\u307e\u3059\u3002<br>\u95a2\u6570\u306b\u3064\u3044\u3066\u306f\u4eca\u56de\u306f\u8aac\u660e\u3057\u307e\u305b\u3093\u304c\u3001\u6a5f\u80fd\u3092\u547c\u3073\u51fa\u3057\u3066\u3044\u308b\u3068<br>\u601d\u3063\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">getElementByID\u306fhtml\u5185\u3067 button \u3068\u3044\u3046ID\u540d\u3092\u4f7f\u7528\u3057\u3066\u3044\u308b\u3082\u306e\u3092\u53d6\u5f97\u3059\u308b<br>\u3068\u3044\u3046\u3053\u3068\u3067\u3059\u3002\u306a\u306e\u3067\u4eca\u56de\u3001&lt;button id=&#8221;button&#8221;&gt; \u3092\u53d6\u5f97\u3057\u3066\u3044\u308b\u3068\u3044\u3046\u3053\u3068\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">addEventListener \u306f\u8981\u7d20\u306b\u5bfe\u3057\u3066\u306a\u306b\u304b\u304c\u8d77\u304d\u305f\u3089\u3068\u3044\u3046\u30a4\u30d9\u30f3\u30c8\u3092\u691c\u77e5\u3055\u305b\u308b<br>\u70ba\u306e\u8a18\u8ff0\u3067\u3059\u3002\u4eca\u56de\u306f &#8220;click&#8221; \u3092\u691c\u77e5\u3055\u305b\u305f\u304b\u3063\u305f\u306e\u3067\u3001<br>target.addEventListener(&#8220;click&#8221;,function(e){<br>});<br>\u3068\u8a18\u8ff0\u3057\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">function(e)\u306f\u95a2\u6570\u3092\u4f5c\u6210\u3057\u3066\u3001&#8221;click&#8221;\u3055\u308c\u305f\u3068\u304d\u306b<br>\u3053\u306e\u95a2\u6570\u304c\u4f5c\u52d5\u3057\u307e\u3059\u3088\u3068\u3044\u3046\u3053\u3068\u3067\u3059\u3002\u95a2\u6570\u3063\u3066\u666e\u901a\u306f<br>function hoge (){<br>}<br>\u307f\u305f\u3044\u306b\u540d\u524d\u304c\u3064\u3044\u3066\u3044\u308b\u3053\u3068\u304c\u591a\u3044\u3067\u3059\u304c\u3001JS\u3067\u306f\u7121\u540d\u95a2\u6570\u3068\u3044\u3046\u3082\u306e\u304c\u3042\u308a\u3001<br>\u95a2\u6570\u306b\u540d\u524d\u3092\u3064\u3051\u306a\u304f\u3066\u4f7f\u7528\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u521d\u3081\u3066\u3060\u3068\u3061\u3087\u3063\u3068\u56f0\u60d1\u3059\u308b\u304b\u3082\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><br>(e)\u3068\u3044\u3046\u306e\u306f\u30a4\u30d9\u30f3\u30c8\u767a\u751f\u6642\u306b\u30a4\u30d9\u30f3\u30c8\u60c5\u5831\u3092\u95a2\u6570\u306b\u6e21\u3057\u3066\u3044\u307e\u3059\u3002<br>\u3069\u3046\u3044\u3046\u30c7\u30fc\u30bf\u304c\u5165\u3063\u3066\u3044\u308b\u304b\u3068\u3044\u3046\u3068\u3001\u3069\u3093\u306a\u30dc\u30bf\u30f3\u304c\u62bc\u3055\u308c\u305f\u304b\uff5e<br>\u7b49\u3068\u3044\u3046\u30a4\u30d9\u30f3\u30c8\u306b\u307e\u3064\u308f\u308b\u30c7\u30fc\u30bf\u3067\u3059\u3002<br>\u6c17\u306b\u306a\u308b\u65b9\u306f <\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"> target.addEventListener(\"click\",function(e){<br>\u3000\u3000console.log(e);<br>}); <\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u3001\u5148\u7a0b\u306e\u8a18\u8ff0\u3060\u3068\u30af\u30ea\u30c3\u30af\u3057\u305f\u3068\u304d\u306b\u4f55\u304b\u3059\u308b\u307e\u3067\u306e\u6e96\u5099\u306f\u3057\u307e\u3057\u305f\u304c\u3001<br>\u4f55\u3092\u3059\u308b\u304b\u307e\u3067\u306e\u8a18\u8ff0\u306f\u66f8\u3044\u3066\u3044\u307e\u305b\u3093\u3002<br>\u4f55\u3092\u3059\u308b\u304b\u306e\u8a18\u8ff0\u306f<br>function () {  \u3053\u3053\u306b\u66f8\u304f\uff01 }\u306b\u66f8\u304d\u307e\u3059\u3002<br>\u306a\u306e\u3067\u3001\u4eca\u56de\u306f\u30af\u30ea\u30c3\u30af\u3057\u305f\u3089\u30c6\u30ad\u30b9\u30c8\u304c\u5909\u308f\u308b\u3088\u3046\u306b\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4e00\u65e6\u3053\u306e\u72b6\u614b\u3067\u30d6\u30e9\u30a6\u30b6\u3067\u78ba\u8a8d\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"959\" height=\"747\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website2-1.jpg\" alt=\"\" class=\"wp-image-792\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website2-1.jpg 959w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website2-1-300x234.jpg 300w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website2-1-768x598.jpg 768w\" sizes=\"(max-width: 959px) 100vw, 959px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>\u62bc\u3057\u3066\u306d\uff01<\/strong>\u3068\u3044\u3046\u30dc\u30bf\u30f3\u304c\u51fa\u3066\u3044\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u306e\u3067\u3001\u305d\u3061\u3089\u3092\u62bc\u3057\u3066\u307f\u307e\u3059\u3002<br>\u62bc\u3059\u3068\u3001\u30b3\u30f3\u30bd\u30fc\u30eb\u753b\u9762\u306b <strong>hoge<\/strong> \u3068\u51fa\u3066\u3044\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u3002<br>\u3061\u3083\u3093\u3068 js \u304c\u52d5\u4f5c\u3057\u3066\u3044\u308b\u3053\u3068\u304c\u78ba\u8a8d\u3067\u304d\u305f\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u306f\u30c6\u30ad\u30b9\u30c8\u3092\u5909\u66f4\u3057\u305f\u3044\u306e\u3067\u3001&lt;p&gt;\u8981\u7d20\u3092JavaScript\u3067\u5236\u5fa1\u3057\u3084\u3059\u3044\u3088\u3046\u306b<br>\u30af\u30e9\u30b9\u540d\u3092\u66f8\u3044\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"> &lt;p&nbsp;class=\"text\"&gt;\u3053\u3093\u306b\u3061\u306f\uff01&lt;\/p&gt; <\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">&lt;p&gt;\u8981\u7d20\u3092\u4ee5\u4e0a\u306e\u3088\u3046\u306b\u3057\u307e\u3057\u305f\u3002\u307f\u306a\u3055\u3093\u306e\u65b9\u3067\u3082\u5909\u66f4\u3057\u3066\u304f\u3060\u3055\u3044\u306d\u3002<br>ID\u3068\u9055\u3063\u3066\u3001class\u306f\u4f55\u5ea6\u3067\u3082\u540c\u3058\u540d\u524d\u3092\u4f7f\u3046\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<br>\u3061\u306a\u307f\u306b\u3001class\u3084ID\u3092\u3064\u3051\u308b\u3053\u3068\u3067css\u3067\u3082\u305d\u306e\u540d\u524d\u3092\u6307\u5b9a\u3059\u308b\u3053\u3068\u3067<br>\u30b9\u30bf\u30a4\u30eb\u3092\u5f53\u3066\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">JS\u5074\u3067Class\u540d\u304b\u3089\u8981\u7d20\u3092\u6307\u5b9a\u3059\u308b\u6642\u306f\u3001<br>getElementsByClassName()<br>\u3092\u4f7f\u3044\u307e\u3059\u3002\u4e00\u65e6\u3053\u308c\u3067\u30c6\u30ad\u30b9\u30c8\u8981\u7d20\u304c\u53d6\u5f97\u3067\u304d\u3066\u3044\u308b\u304b\u78ba\u8a8d\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var&nbsp;target&nbsp;=&nbsp;document.getElementById(\"button\");\nvar&nbsp;text&nbsp;=&nbsp;document.getElementsByClassName(\"text\");\ntarget.addEventListener(\"click\",&nbsp;function&nbsp;(e)&nbsp;{\n&nbsp;&nbsp;console.log(text);\n}); <\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u3088\u3046\u306b\u6210\u308a\u307e\u3057\u305f\u3002 var text ~~ \u3067 text\u3068\u3044\u3046\u5909\u6570\u306b &lt;p class=&#8221;text&#8221;&gt;\u306e\u8981\u7d20\u3092\u683c\u7d0d\u3057\u307e\u3057\u305f\u3002\u3053\u308c\u3067&lt;p class=&#8221;text&#8221;&gt;\u306b\u5bfe\u3057\u3066\u64cd\u4f5c\u304c\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3057\u305f\u304c\u3001\u3061\u3083\u3093\u3068\u683c\u7d0d\u3055\u308c\u3066\u3044\u308b\u304b\u78ba\u8a8d\u3059\u308b\u305f\u3081\u306b\u3001console.log(text)\u3092\u8a18\u8ff0\u3057\u3001<br>\u30b3\u30f3\u30bd\u30fc\u30eb\u753b\u9762\u306b\u6b63\u3057\u304f\u8981\u7d20\u304c\u683c\u7d0d\u3055\u308c\u3066\u3044\u308b\u304b\u78ba\u8a8d\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"945\" height=\"741\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website3.jpg\" alt=\"\" class=\"wp-image-793\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website3.jpg 945w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website3-300x235.jpg 300w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website3-768x602.jpg 768w\" sizes=\"(max-width: 945px) 100vw, 945px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u30dc\u30bf\u30f3\u3092\u62bc\u3057\u305f\u3068\u304d\u306b console.log(text); \u304c\u52d5\u4f5c\u3059\u308b\u306e\u3067\u3001\u30dc\u30bf\u30f3\u3092\u30af\u30ea\u30c3\u30af\u3057\u3066\u307f\u308b\u3068\u3001Console\u306b\u3061\u3083\u3093\u3068text\u306e\u8981\u7d20\u304c\u3067\u3066\u3044\u307e\u3059\u306d\uff01<br>\u3061\u3083\u3093\u3068\u53d6\u5f97\u3067\u304d\u3066\u3044\u308b\u306e\u304c\u78ba\u8a8d\u3067\u304d\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u306f\u3001\u3053\u306e\u30c6\u30ad\u30b9\u30c8\u8981\u7d20\u306bJS\u5074\u3067\u64cd\u4f5c\u3092\u52a0\u3048\u3066\u307f\u307e\u3057\u3087\u3046\u3002<br>\u4eca\u56de\u306f\u30c6\u30ad\u30b9\u30c8\u3092\u64cd\u4f5c\u3059\u308b\u306e\u3067 innerHTML\u306b\u5909\u66f4\u3092\u52a0\u3048\u307e\u3059\u3002<br>\u4e0b\u8a18\u306e\u3088\u3046\u306a\u8a18\u8ff0\u306b\u306a\u308a\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var&nbsp;target&nbsp;=&nbsp;document.getElementById(\"button\");\nvar&nbsp;text&nbsp;=&nbsp;document.getElementsByClassName(\"text\");\ntarget.addEventListener(\"click\",&nbsp;function&nbsp;(e)&nbsp;{\n&nbsp;&nbsp;text[0].innerHTML&nbsp;=&nbsp;\"\u304a\u524d\u3092\u307f\u3066\u3044\u308b\u305e\";\n}); <\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">text[0]\u3068\u306a\u3063\u3066\u3044\u308b\u7406\u7531\u306f\u3001getElementsByClassName\u3067\u53d6\u5f97\u3059\u308b\u6642\u306f<br>\u8907\u6570\u3042\u308b\u3082\u306e\u3068\u3057\u3066\u8981\u7d20\u3092\u53d6\u5f97\u3057\u3066\u3044\u307e\u3059\u3002\u306a\u306e\u3067\u3001\u4e00\u500b\u3057\u304b\u306a\u304f\u3066\u3082<br>\u914d\u5217\u8981\u7d20\u3067\u5e30\u3063\u3066\u304d\u3066\u3044\u308b\u306e\u3067\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"412\" height=\"83\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website4.jpg\" alt=\"\" class=\"wp-image-794\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website4.jpg 412w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website4-300x60.jpg 300w\" sizes=\"(max-width: 412px) 100vw, 412px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u30b3\u30f3\u30bd\u30fc\u30eb\u753b\u9762\u3092\u78ba\u8a8d\u3059\u308b\u3068\u30010: p.text<br>\u3068\u8a18\u8f09\u3055\u308c\u3066\u3044\u307e\u3059\u306d\u3002\u914d\u5217\u306e\u5834\u5408\u3053\u306e\u3088\u3046\u306b\u5165\u3063\u3066\u304d\u3066\u3044\u307e\u3059\u3002<br>\u914d\u5217\u3063\u3066\u306a\u306b\uff1f\u3063\u3066\u8a00\u3046\u4eba\u3082\u5c45\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u306e\u3067\u8efd\u304f\u89e3\u8aac\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u666e\u901a\u306e\u5909\u6570\u306f  var hoge = &#8220;\u3053\u3093\u306b\u3061\u306f&#8221;;<br>\u306e\u3088\u3046\u306b\u5909\u6570\u306b\u5165\u308c\u308b\u306e\u306f1\u3064\u306e\u8981\u7d20\u306e\u307f\u3067\u3059\u3002<br>\u3067\u3059\u304c\u3001\u914d\u5217\u65b9\u5f0f\u3092\u53d6\u308b\u3053\u3068\u3067\u3001\u8907\u6570\u306e\u8981\u7d20\u3092\u5165\u308c\u3089\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">var hoge = [&#8220;\u304a\u306f\u3088\u3046&#8221;,&#8221;\u3053\u3093\u306b\u3061\u306f&#8221;,&#8221;\u3053\u3093\u3070\u3093\u306f&#8221;];<br>\u4e0a\u8a18\u306e\u3088\u3046\u306b\u3059\u308b\u3053\u3068\u3067\u914d\u5217\u3067\u8907\u6570\u306e\u8981\u7d20\u3092\u5165\u308c\u3089\u308c\u307e\u3059\u3002<br>\u3053\u308c\u3089\u306f\u756a\u53f7\u304c\u632f\u3089\u308c\u3066\u3044\u3066\u3001 \u5de6\u304b\u3089 0,1,2&#8230;\u3068\u3069\u3093\u3069\u3093\u5897\u3048\u3066\u3044\u304d\u307e\u3059\u3002<br>\u306a\u306e\u3067\u3001\u5148\u7a0b\u306etext[0]\u3068\u3057\u3066\u3044\u305f\u306e\u306f\u3001\u4e00\u756a\u6700\u521d\u306e\u8981\u7d20\u306b\u5bfe\u3057\u3066<br>\u306a\u306b\u304b\u3059\u308b\u3088\u3002\u3068\u3044\u3046\u8a18\u8ff0\u3067\u3057\u305f\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u306f\u3001\u5148\u7a0b\u306ejs\u3092\u8a18\u8ff0\u3057\u3066\u3001\u30d6\u30e9\u30a6\u30b6\u3067\u78ba\u8a8d\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"408\" height=\"254\" src=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website5.jpg\" alt=\"\" class=\"wp-image-795\" srcset=\"https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website5.jpg 408w, https:\/\/blog.azarashi-server.com\/wp-content\/uploads\/2019\/10\/website5-300x187.jpg 300w\" sizes=\"(max-width: 408px) 100vw, 408px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u30af\u30ea\u30c3\u30af\u3057\u305f\u3068\u3053\u308d\u3001\u3061\u3083\u3093\u3068\u30c6\u30ad\u30b9\u30c8\u304c\u5909\u308f\u3063\u305f\u306e\u304c<br>\u78ba\u8a8d\u3067\u304d\u305f\u3067\u3057\u3087\u3046\u304b\uff1f<br>\u3053\u308c\u304c\u30c6\u30ad\u30b9\u30c8\u306b\u5bfe\u3059\u308b\u64cd\u4f5c\u3067\u3057\u305f\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">4.\u7d42\u308f\u308a\u306b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6ec5\u8336\u82e6\u8336\u9577\u304f\u306a\u3063\u3066\u3057\u307e\u3044\u307e\u3057\u305f\u3002<br>\u5b9f\u969b\u306b\u4f5c\u3063\u305f\u3082\u306e\u3092web\u30b5\u30a4\u30c8\u3068\u3057\u3066\u516c\u958b\u3057\u305f\u3044\u5834\u5408\u306f\u3001<br>\u4e00\u756a\u6700\u521d\u306b\u4e0a\u3052\u305f FC2\u30db\u30fc\u30e0\u30da\u30fc\u30b8\u7b49\u3067\u3001\u30d5\u30a1\u30a4\u30eb\u3092\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u3059\u308b\u3053\u3068\u3067<br>\u5404\u3005\u4f5c\u6210\u3057\u305fweb\u30b5\u30a4\u30c8\u304c\u95b2\u89a7\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u304b\u306a\u308a\u7c21\u5358\u306a\u3053\u3068\u3057\u304b\u3084\u3063\u3066\u3044\u307e\u305b\u3093\u304c\u3001<br>\u57fa\u672c\u7684\u306a\u3053\u3068\u306f\u304a\u4f1d\u3048\u3044\u305f\u3057\u307e\u3057\u305f\u306e\u3067\u3001\u3053\u308c\u3092\u62e1\u5f35\u3057\u3066<br>\u7c21\u5358\u306aweb\u30b5\u30a4\u30c8\u3092\u4f5c\u3063\u3066\u307f\u3066\u306f\u3044\u304b\u304c\u3067\u3057\u3087\u3046\u304b\uff1f<\/p>\n","protected":false},"excerpt":{"rendered":"<p>web\u30b5\u30a4\u30c8\u4f5c\u3063\u3066\u307f\u305f\u3044\u306a\uff5e\u3063\u3066\u601d\u3063\u305f\u3053\u3068\u304c\u3042\u308b\u4eba\u306f\u7d50\u69cb\u3044\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u3002\u305d\u3093\u306a\u4eba\u5411\u3051\u306e\u8d85\uff01\u5165\u9580\u7de8\u306e\u8a18\u4e8b\u3067\u3059\u3002\uff08\u5f53\u30a2\u30b6\u30e9\u30b7\u30db\u30fc\u30eb\u3067\u306f\u203b\u30d7\u30ed\u306e\u3054\u904a\u622f\u306f\u304a\u65ad\u308a\u3057\u3066\u304a\u308a\u307e\u3059\uff09 \u8a18\u4e8b\u3068\u3057\u3066\u306f\u304b\u306a\u308a\u9577\u3044\u306e\u3067\u899a\u609f\u306e\u6e96\u5099\u3092\u3057\u3066\u304a\u3044\u3066\u304f [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[70,69,71,68,79,47,20],"tags":[75,164,165,167,7,166],"class_list":["post-550","post","type-post","status-publish","format-standard","hentry","category-css","category-html","category-js","category-web","category-79","category-47","category-20","tag-css","tag-html","tag-js","tag-web","tag-7","tag-166"],"views":3767,"_links":{"self":[{"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=\/wp\/v2\/posts\/550","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=550"}],"version-history":[{"count":16,"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=\/wp\/v2\/posts\/550\/revisions"}],"predecessor-version":[{"id":1121,"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=\/wp\/v2\/posts\/550\/revisions\/1121"}],"wp:attachment":[{"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=550"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=550"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.azarashi-server.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=550"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}