Upgrade to Pro — share decks privately, control downloads, hide ads and more …

create-website-html-2021

 create-website-html-2021

91e7aee9769836f448a9f1ce91255749?s=128

Masateru YOSHIMURA

June 25, 2021
Tweet

Transcript

  1. ෳ਺ϖʔδͷ΢ΣϒαΠ τ ʢ࣮ફฤʣ ʮϙʔτϑΥϦΦαΠτΛͭ͘Δʯ

  2. )5.-΍$44Λॻ͘લʹɺ ϖʔδͷجຊతͳߏ੒ͱ αΠτશମͷߏ੒Λ೺Ѳ͠·͠ΐ͏ɻ

  3. None
  4. ϔομʔ ϑολʔ

  5. ϔομʔ ϑολʔ શϖʔδڞ௨ ϝΠϯ ֤ϖʔδͷ಺༰

  6. ࣗݾ঺հ ϩΰ ˜:PVS/BNF ࡞඼ɾϓϩδΣΫτ ϊʔτ τοϓϖʔδʢҰཡϖʔδʣ JOEFYIUNM ΢ΣϒαΠτͷશମߏ੒ɿ߹ܭϖʔδ͸ϖʔδҎ্ʹͳΔΑ͏ʹ͍ͯͩ͘͠͞ ϖʔδҎ্ ϦϯΫ

    ϦϯΫ ࣗݾ঺հ ϩΰ ˜:PVS/BNF ϓϩδΣΫτ໊ ϩΰ ˜:PVS/BNF ࣗݾ঺հʢৄࡉϖʔδʣ QSPpMFIUNM ࡞඼ɾϓϩδΣΫτʢৄࡉϖʔδʣ QSPKFDUIUNMQSPKFDUIUNM ϖʔδҎ্ هࣄλΠτϧ ϩΰ ˜:PVS/BNF ϊʔτʢৄࡉϖʔδʣ OPUFIUNMOPUFIUNM ϦϯΫ ϖʔδ ˞ϖʔδ਺͸ଟ͍ํ͕ߴධՁʹͳΓ·͢ ˞શମߏ੒΍֤ϖʔδͷϨΠΞ΢τ͸ҰྫͰ͢ɻ͜ͷ௨Γʹ͍ͯͩ͘͠͞ͱ͍͏͜ͱͰ͸͋Γ·ͤΜɻ )5.-Ͱ࡞Δ
  7. ϝΠϯ ϔομʔ ϖʔδ಺ͷ)5.-ߏ੒ɿશϖʔδڞ௨ ϑολʔ <header> ϩΰ΍φϏήʔγϣϯ͕ೖΔ </header> <main> ֤ϖʔδͷ಺༰͕ೖΔ </main>

    <footer> ஶ࡞ݖදه΍φϏήʔγϣϯ͕ೖΔ </footer> ˞$PEF1FOͷαϯϓϧͰ͸NBJOλάͷத਎ͷΈΛॻ͍͍ͯ·͢
  8. ϖʔδ಺ͷ)5.-ߏ੒ɿҰཡϖʔδͷྫᶃ <section id="profile"> ࣗݾ঺հϖʔδ΁ͷ༠ಋ </section> ֤ηΫγϣϯΛࣝผ͢ΔͨΊʹJEͰ໊લΛ͚ͭΔɻ <section id="project"> ࡞඼ɾϓϩδΣΫτ΁ͷ༠ಋ </section>

    <section id="note"> ϊʔτ΁ͷ༠ಋ </section> Ұཡϖʔδ͸ ৄࡉϖʔδ΁ͷ ༠ಋ܎ɻ ҰཡϖʔδͰ͸ ৄ͘͠આ໌͠ͳ͍ɻ TFDUJPOλάΛ༻͍ͯɺηΫγϣϯʹ෼͚ΔɻEJWλάΛ࢖ͬͯ΋ྑ͍ɻ ࣗݾ঺հ ϩΰ ϑολʔ ࡞඼ɾϓϩδΣΫτ ϊʔτ ˞ϨΠΞ΢τ͸ҰྫͰ͢ɻ͜ͷ௨Γʹ͍ͯͩ͘͠͞ͱ͍͏͜ͱͰ͸͋Γ·ͤΜɻ ͔͜͜Βৄࡉϖʔδ΁ τοϓϖʔδʢҰཡϖʔδʣ JOEFYIUNM
  9. ϖʔδ಺ͷ)5.-ߏ੒ɿҰཡϖʔδͷྫᶄ <nav> ֤ϖʔδ΁ͷϦϯΫ </nav> ϩΰ ϑολʔ 501"#065803,4/05&4 ϝΠϯը૾ ˞ϨΠΞ΢τ͸ҰྫͰ͢ɻ͜ͷ௨Γʹ͍ͯͩ͘͠͞ͱ͍͏͜ͱͰ͸͋Γ·ͤΜɻ ϩΰ

    ϑολʔ 501"#065803,4/05&4 803,4 ͔͜͜Βৄࡉϖʔδ΁ τοϓϖʔδʢҰཡϖʔδʣ JOEFYIUNM ࡞඼ɾϓϩδΣΫτҰཡʢҰཡϖʔδʣ QSPKFDUIUNM
  10. ϖʔδ಺ͷ)5.-ߏ੒ɿৄࡉϖʔδ <div class="content-header"> λΠτϧ΍αϒλΠτϧɺϝΠϯը૾ </div> ελΠϦϯάΛ͠΍͍͢Α͏ʹɺ ίϯςϯπΛʮ಄ɾମɾ଍ʯͷͭͷ෦෼ʹ෼͚Δɻ ϑολʔ <div class="content-body">

    ຊจɺຊจ಺Ͱ༻͍Δը૾ </div> <div class="content-footer"> Ұཡϖʔδʹ΋ͲΔϘλϯɺؔ࿈ϖʔδ </div> ϓϩδΣΫτ໊ ΋ͲΔ ݪଇͱͯ͠ɺ Ұཡϖʔδͱ͸ ҟͳΔDMBTT໊Λ༻͍Δ͜ͱɻ ϨΠΞ΢τ่ΕͷݪҼͱͳΔɻ ٯʹɺଞͷৄࡉϖʔδͱ͸ ڞ௨ͷDMBTT໊Λ༻͍Δ͜ͱɻ ྫ͑͹ɺQSPKFDUIUNMͱQSPKFDUIUNMͰ͸ ಉ͡DMBTT໊Λ༻͍Δɻ ϔομʔ ࡞඼ɾϓϩδΣΫτʢৄࡉϖʔδʣ QSPKFDUIUNMQSPKFDUIUNM ৄࡉϖʔδ͸·ͣͭΛ࡞Γ্͔͛ͯΒɺ ϑΟΞϧΛίϐϖͯ͠಺༰Λࠩ͠ସ͑Δͱ ޮ཰ྑ͘࡞Δ͜ͱ͕Ͱ͖·͢ɻ
  11. 8FCͰը૾Λ࢖͏ͱ͖ͷ஫ҙ఺ ᶃ σʔλྔ͸Ͱ͖ΔݶΓখ͘͞ʢ͍ܰʣ ˠେ͖͍ͱද͕ࣔ஗͘ͳΔʢॏ͘ͳΔʣɺ ɹར༻ऀʹ௨৴ෛՙΛ͔͚ͯ͠·͏ʢύέࢮʣ ᶄ ྑ͍ը࣭Ͱදࣔ͢Δ ˠσʔλྔͱͷόϥϯεΛΈͳ͕Β ɹ༻్ʹԠͯ͡࠷దԽ͢Δඞཁ͕͋Δ

  12. ը૾αΠζͷ࠷దԽ ෯ QYߴ͞ QYσʔλྔ.# ෯ QYߴ͞QY σʔλྔ,# ύιίϯ΍εϚϗͷϞχλͰ͸ ͜ͷαΠζͰे෼͖Ε͍ʹݟ͑ΔͷͰ খ͔ͯ͘͞͠Βར༻͢Δ

    J1IPOFͰࡱӨͨ͠ΦϦδφϧͷαΠζ ͜ͷ৔߹ σʔλྔ͸ ʹ ϊʔτ1$ͷը໘෯͸ QYલޙ ॖখ͢Ε͹
  13. ಡΈํ ֦ுࢠ ը࣭ ಁա ༻్ +1&( δΣΠϖά KQH ྼԽ͢Δ ಁաͰ͖ͳ͍

    ࣸਅ 1/( ϐϯά .png ྼԽ͠ͳ͍ ಁաͰ͖Δ ϩΰɺਤͳͲ ৭਺͕গͳ͍΋ͷ 8FCͰ࢖͏ը૾ͷछྨ ͦͷ΄͔8FC1΍47(ɺ(*'ͳͲͷܗ͕ࣜ͋Δ͕ɺ͜ͷतۀͰ͸ѻΘͳ͍ɻ ͜ͷतۀͰ͸+1&(ͷѻ͍Λৄ͘͠આ໌͢Δɻ কདྷతʹ͸8FC1͕ελϯμʔυͳܗࣜʹͳΔͱݴΘΕ͍ͯΔɻ ࣸਅΛ1/(ܗࣜʹ͢Δͱ σʔλྔ͕େ͖͘ͳΔέʔε͕ଟ͍ͨΊ ࣸਅΛ1/(ܗࣜʹ͠ͳ͍͜ͱʂ
  14. ը૾αΠζมߋͷํ๏ 8JOEPXT΋.BD΋ඪ४ΞϓϦͰͰ͖Δɻ ΍Γํ͸ɺ8FC্ʹ঺հهࣄ͕ͨ͘͞Μ͋ΔͷͰɺ ࣗ෼Ͱௐ΂ͯ΍ͬͯΈΑ͏ɻ ҎલͷतۀͰ͸εϚϗͰࡱӨͨ͠ը૾Λ $BOWBͱ͍͏αʔϏεΛར༻ͯ͠ ύιίϯͰ࢖͑ΔΑ͏ʹ͠·ͨ͠ɻ

  15. ը૾͸͢΂ͯ ഑෍ϑΥϧμ಺ͷ JNHTϑΥϧμ಺ʹೖΕ͍ͯͩ͘͞ɻ ˞ͦͷ΄͔ͷϑΥϧμʹೖΕͯ΋දࣔ͞Εͳ͍ͷͰ஫ҙ͠·͠ΐ͏ ը૾ͷ഑ஔ৔ॴ

  16. ը૾ɾϖʔδͷϑΝΠϧ໊ͷϧʔϧ w ൒֯ӳ਺จࣈΛ࢖͏ w খจࣈͷBˠ[Λ࢖͏ w ਺ࣈͷˠ΋࢖͑Δ w ϋΠϑϯ΋࢖͑Δ w

    ΞϯμʔείΞ@΋࢖͑Δ ͦͷଞ͸࢖͑ͳ͍ͷͰ஫ҙʂ ˕OPUFIUNM MPHPQOH QIPUPKQH BCPVUIFBEFSKQH ʷ/PUFIUNM ̡̤̜̤QOH ࣸਅKQH BCPVUIFBEFSKQH େจࣈ શ֯จࣈ ೔ຊޠ εϖʔε