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

create-website-html-2021

 create-website-html-2021

Masateru YOSHIMURA

June 25, 2021
Tweet

More Decks by Masateru YOSHIMURA

Other Decks in Design

Transcript

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

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

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

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

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

    ຊจɺຊจ಺Ͱ༻͍Δը૾ </div> <div class="content-footer"> Ұཡϖʔδʹ΋ͲΔϘλϯɺؔ࿈ϖʔδ </div> ϓϩδΣΫτ໊ ΋ͲΔ ݪଇͱͯ͠ɺ Ұཡϖʔδͱ͸ ҟͳΔDMBTT໊Λ༻͍Δ͜ͱɻ ϨΠΞ΢τ่ΕͷݪҼͱͳΔɻ ٯʹɺଞͷৄࡉϖʔδͱ͸ ڞ௨ͷDMBTT໊Λ༻͍Δ͜ͱɻ ྫ͑͹ɺQSPKFDUIUNMͱQSPKFDUIUNMͰ͸ ಉ͡DMBTT໊Λ༻͍Δɻ ϔομʔ ࡞඼ɾϓϩδΣΫτʢৄࡉϖʔδʣ QSPKFDUIUNMQSPKFDUIUNM ৄࡉϖʔδ͸·ͣͭΛ࡞Γ্͔͛ͯΒɺ ϑΟΞϧΛίϐϖͯ͠಺༰Λࠩ͠ସ͑Δͱ ޮ཰ྑ͘࡞Δ͜ͱ͕Ͱ͖·͢ɻ
  6. ಡΈํ ֦ுࢠ ը࣭ ಁա ༻్ +1&( δΣΠϖά KQH ྼԽ͢Δ ಁաͰ͖ͳ͍

    ࣸਅ 1/( ϐϯά .png ྼԽ͠ͳ͍ ಁաͰ͖Δ ϩΰɺਤͳͲ ৭਺͕গͳ͍΋ͷ 8FCͰ࢖͏ը૾ͷछྨ ͦͷ΄͔8FC1΍47(ɺ(*'ͳͲͷܗ͕ࣜ͋Δ͕ɺ͜ͷतۀͰ͸ѻΘͳ͍ɻ ͜ͷतۀͰ͸+1&(ͷѻ͍Λৄ͘͠આ໌͢Δɻ কདྷతʹ͸8FC1͕ελϯμʔυͳܗࣜʹͳΔͱݴΘΕ͍ͯΔɻ ࣸਅΛ1/(ܗࣜʹ͢Δͱ σʔλྔ͕େ͖͘ͳΔέʔε͕ଟ͍ͨΊ ࣸਅΛ1/(ܗࣜʹ͠ͳ͍͜ͱʂ
  7. ը૾ɾϖʔδͷϑΝΠϧ໊ͷϧʔϧ w ൒֯ӳ਺จࣈΛ࢖͏ w খจࣈͷBˠ[Λ࢖͏ w ਺ࣈͷˠ΋࢖͑Δ w ϋΠϑϯ΋࢖͑Δ w

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