Slide 1

Slide 1 text

ϓϩάϥϚ͕஌͓ͬͯ͘ͱ ͍͍͔΋͠Εͳ͍ $44ͷϋφγ ߹ಉษڧձd8JOUFSd ٢ాوจʢ![FQIJSBOTBT Ԭࢁ+BWBϢʔβձ

Slide 2

Slide 2 text

8IPBN* w ٢ాوจ ![FQIJSBOTBT w Ԭࢁ+BWBϢʔβձɹ୅ද w גࣜձࣾϦκʔϜॴଐ w 3VCZ 3VCZPO3BJMT ͕ϝΠϯ

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

ࠓ೔͸+BWBͷ ࿩୊͡Όͳ͍

Slide 6

Slide 6 text

ࠓ೔࿩͢͜ͱ w #PPUTUSBQͬΆ͞ΛऔΖ͏ w σβΠϯ͞ΕͨνΣοΫϘοΫεϥδΦϘλϯ w qFYCPY͸ศར

Slide 7

Slide 7 text

#PPUTUSBQͬΆ͞Λ औΖ͏

Slide 8

Slide 8 text

ΤϯδχΞେ޷͖ #PPUTUSBQ w $44ৄ͘͠ͳͯ͘΋ɺΠϚυΩͬΆ͍ϖʔδ͕࡞Ε Δ w σβΠϯࡁͷίϯϙʔωϯτ͕͋ΔͷͰָ w ྲྀߦͬͨނʹɺͲ͔͜ͰΈͨΑ͏ͳαΠτʹ w ๞͖Δ

Slide 9

Slide 9 text

#PPUTUSBQΆ͞Λফ͢ w ࢖͏ͷ͸άϦουγεςϜ͚ͩ w ϑΥϯτʹ೔ຊޠ༻ϑΥϯτΛࢦఆ͢Δ w CPPUTUSBQͷίϯϙʔωϯτΛ΍ΊΔ w ͍ΖΜͳαΠτͷؾʹೖͬͨίϯϙʔωϯτΛࢀ ߟʹ͢Δ

Slide 10

Slide 10 text

σβΠϯ͞Εͨ νΣοΫϘοΫεͱ ϥδΦϘλϯ

Slide 11

Slide 11 text

σϑΥϧτͷ··ʂ

Slide 12

Slide 12 text

νΣοΫϘοΫε΍ ϥδΦϘλϯ͸ σβΠϯͰ͖ͳ͍

Slide 13

Slide 13 text

CFGPSF BGUFSٙࣅཁૉͰ ࣗલͰඳը͢Δ

Slide 14

Slide 14 text

君のこころは輝いてるかい?
2.labelͷ֎ଆʹinputλάΛઃஔ͢Δ 3.forଐੑͰνΣοΫର৅ͷidΛࢦఆ 1.શମΛద੾ͳΫϥεΛ෇͚ͨdivͰғΉ

Slide 15

Slide 15 text

ී௨ͷνΣοΫϘοΫεΛফͯ͠ɺ৽ͨʹνΣο ΫϘοΫεͷʮΑ͏ͳ΋ͷʯΛඳը͢Δ

Slide 16

Slide 16 text

.form-checkbox { input[type="checkbox"] { display: none; } label { &:before { content: ''; width: 20px; height: 20px; border: 2px solid darken(#ddd, 15%); border-radius: 3px; background: #ddd; } } } 1.ී௨ͷνΣοΫϘοΫεΛফ͢ 2:labelͷbeforeཁૉͱͯ͠ϘοΫεΛඳը͢Δ

Slide 17

Slide 17 text

νΣοΫϚʔΫΛͲ͏͢Δʁ

Slide 18

Slide 18 text

BGUFSͱDIFDLFEٙࣅཁૉ Λ૊Έ߹Θͤͯඳը

Slide 19

Slide 19 text

.form-checkbox { input[type="checkbox"] { display: none; &:checked + label:after { font-family: FontAwesome; content: '\f00c'; color: #59b200; } } } 1.νΣοΫ͕ೖͬͯɺ͔ͭɺ௚ޙͷlabel༻ͷafterʹඳը 2.νΣοΫϚʔΫͱͯ͠FontAwesomeͷνΣοΫΛ࢖͏

Slide 20

Slide 20 text

Ϣχίʔυͷจࣈίʔυ͕͋Δ

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

w ಉ༷ͷखޱͰɺϥδΦϘλϯ΋Ͱ͖Δ w εϥΠυͷ$44͸ϨΠΞ΢τपΓΛলུͯ͠ΔͷͰɺ ࣮ࡍ͸(JU)VCͷαϯϓϧΛͲ͏ͧ

Slide 23

Slide 23 text

qFYCPY͸ศར

Slide 24

Slide 24 text

ΤϯδχΞ͕ $44Ͱ೰Ήͷ͸ϨΠΞ΢τ w ಛʹԣฒͼͷϨΠΞ΢τ w EJTQMBZͷCMPDL JOMJOF JOMJOFCMPDLͷҧ͍ w qPBUͰϨΠΞ΢τ่͕ΕΔ w UFYUBMJHOɺWFSUJDBMBMJHOޮ͔ͳ͍ɾɾɾFUD

Slide 25

Slide 25 text

qFYCPY͕ศར

Slide 26

Slide 26 text

ରԠঢ়گ

Slide 27

Slide 27 text

.flex-container { display: flex; justify-content: flex-start; align-items: stretch; } ਌ίϯςφʹʮdisplay:flexʯΛࢦఆ Ϥίํ޲ͷϨΠΞ΢τΛʮjustify-contentʯͰࢦఆ λςํ޲ͷϨΠΞ΢τΛʮalign-itemsʯͰࢦఆ

Slide 28

Slide 28 text

KVTUJGZDPOUFOU w ԣํ޲ͷϨΠΞ΢τΛࢦఆ w qFYTUBSU EFGBVMU w DFOUFS w qFYFOE w TQBDFCFUXFFO w TQBDFBSPVOE

Slide 29

Slide 29 text

qFYTUBSU

Slide 30

Slide 30 text

DFOUFS

Slide 31

Slide 31 text

qFYFOE

Slide 32

Slide 32 text

TQBDFCFUXFFO

Slide 33

Slide 33 text

TQBDFBSPVOE

Slide 34

Slide 34 text

BMJHOJUFNT w ॎํ޲ͷϨΠΞ΢τΛࢦఆ w TUSFUDI EFGBVMU w qFYTUBSU w DFOUFS w qFYFOE

Slide 35

Slide 35 text

TUSFUDI

Slide 36

Slide 36 text

qFYTUBSU

Slide 37

Slide 37 text

DFOUFS

Slide 38

Slide 38 text

qFYFOE

Slide 39

Slide 39 text

·ͱΊ w #PPUTUSBQ͸άϦου͚ͩ࢖͏ w ϑΥϯτΛͪΌΜͱࢦఆ͢Δ w #PPUTUSBQͷίϯϙʔωϯτΛ΍ΊͯΈΔ w BGUFS CFGPSFͰνΣοΫϘοΫεɾϥδΦϘλϯ΋ ͔ͬ͜Α͘ w qFYCPYศར

Slide 40

Slide 40 text

αϯϓϧ w σβΠϯ͞ΕͨνΣοΫϘοΫεͱϥδΦϘλϯͷ αϯϓϧ w IUUQTHJUIVCDPN[FQIJSBOTBT HCEBJUPLBJ

Slide 41

Slide 41 text

͓ΘΓ