display : block | inline

display : block | inline

91e7aee9769836f448a9f1ce91255749?s=128

Masateru YOSHIMURA

June 26, 2020
Tweet

Transcript

  1. ϒϩοΫϘοΫεͱΠϯϥΠϯϘοΫε

  2. wϒϩοΫϘοΫε wΠϯϥΠϯϘοΫε ٸʹϘοΫεͱ͔ݴΘΕͯ΋ʜ $44ʹ͸छྨͷϘοΫε͕͋Δ

  3. )5.-͸ͲͪΒ͔ͷϘοΫεͰελΠϦϯά͞Ε͍ͯΔ Έͳ͞Μ΁࿈བྷͰ͢ IΈͳ͞Μ΁࿈བྷͰ͢I I՝୊͸ඞͣఏग़͠·͠ΐ͏I Q͜ͷतۀ͸ظ຤ʹςετΛߦ͍·ͤΜɻຖ ճͷतۀ՝୊Λ૯߹ͯ͠੒੷Λग़͠·͢ɻΑͬ ͯɺतۀ՝୊ͷະఏग़͕ଓ͘ͱ୯ҐΛམͱ͢͜ ͱʹͭͳ͕Γ·͢ͷͰ஫ҙ͍ͯͩ͘͠͞ɻQ QBISFG՝୊Λఏग़͢ΔBQ ՝୊͸ඞͣఏग़͠·͠ΐ͏

    ͜ͷतۀ͸ظ຤ʹςετΛߦ͍·ͤΜɻຖճͷतۀ՝୊Λ૯߹ͯ͠ ੒੷Λग़͠·͢ɻΑͬͯɺतۀ՝୊ͷະఏग़͕ଓ͘ͱ୯ҐΛམͱ͢ ͜ͱʹͭͳ͕Γ·͢ͷͰ஫ҙ͍ͯͩ͘͠͞ɻ h1 h2 p ΠϯϥΠϯϘοΫε͸ίϯςϯπʢจࣈ΍ը૾ʣͷ෯ͱಉ͡ ՝୊Λఏग़͢Δ a p ը໘ͷ෯ʢ਌ͷശʣ ϒϩοΫϘοΫε͸਌ʹରͯ͠෯͍ͬͺ͍ʢʣʹͳΔ ౾஌ࣝ 63-ΛԾͰࢦఆ͍ͨ͠ͱ͖͸ ΛೖΕ͓ͯ͘ͱྑ͍
  4. ల։લ ల։ޙ ༻్΍ಛ௃ ϒϩοΫͰදࣔ db display : block; w I

    I QͳͲ͸࠷ॳ͔Β͜Ε w BλάΛϘλϯʹ͍ͨ͠ͱ͖ ΠϯϥΠϯͰදࣔ di display : inline; w B JNHͳͲ͸࠷ॳ͔Β͜Ε w NBSHJOΛઃఆͯ͠΋ແࢹ͞ΕΔ ΠϯϥΠϯɾϒϩοΫͰදࣔ dib display : inline-block; w ͪΐͬͱͨ͠΋ͷΛฒ΂͍ͨͱ͖ w BλάΛϘλϯʹ͍ͨ͠ͱ͖ w ฒ΂͍ͨ΋ͷʹࢦఆ ϑϨΩγϒϧʹදࣔ df display : flex; w ίϯςϯπΛ͖Ε͍ʹ੔಴ͯ͠ฒ΂ ͍ͨͱ͖ w ฒ΂͍ͨ΋ͷͷ਌ʹࢦఆ ϘοΫεͷදࣔઃఆ͍Ζ͍Ζ