λ³Έλ¬Έ λ°”λ‘œκ°€κΈ°
[HTML+CSS][CSS3와 μ• λ‹ˆλ©”μ΄μ…˜] 02 - λ³€ν˜•κ³Ό κ΄€λ ¨λœ 속성듀 [HTML+CSS][CSS3와 μ• λ‹ˆλ©”μ΄μ…˜] 01 - λ³€ν˜• [HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 03 - 가상 ν΄λž˜μŠ€μ™€ 가상 μš”μ†Œ [HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 02 - 속성 μ„ νƒμž [HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 01 - μ—°κ²° μ„ νƒμž [HTML+CSS][HTML5와 λ©€ν‹°λ―Έλ””μ–΄].. onelight-stay.tistory.com λ‹¨μˆœνžˆ λ³€ν˜•λ˜λŠ” 것듀에 λŒ€ν•΄ μ§€λ‚œ μ‹œκ°„μ— λ°°μ› λ‹€λ©΄ μ΄λ²ˆμ—λŠ” λ³€ν˜•ν•  λ•Œ 기쀀이 λ˜λŠ” 지점을 λ°”κΎΈκ±°λ‚˜ μš”μ†Œμ˜ 원근감을 ν‘œν˜„ν•  수 μžˆλŠ” 속성듀에 λŒ€ν•΄μ„œ μ•Œμ•„λ³΄λ„λ‘ ν•˜μž. transform-origin 속성 : λ³€ν˜• 기쀀점 μ„€μ • transform 속성에 μ“°μ΄λŠ” λ³€ν˜•ν•¨μˆ˜λŠ” xμΆ•κ³Ό yμΆ•, z좕을 κΈ°μ€€μœΌλ‘œ λ³€ν˜•ν•˜μ˜€μ§€λ§Œ transfroem-origin.. 2020. 7. 29.
[HTML+CSS][CSS3와 μ• λ‹ˆλ©”μ΄μ…˜] 01 - λ³€ν˜• [HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 03 - 가상 ν΄λž˜μŠ€μ™€ 가상 μš”μ†Œ [HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 02 - 속성 μ„ νƒμž [HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 01 - μ—°κ²° μ„ νƒμž [HTML+CSS][HTML5와 λ©€ν‹°λ―Έλ””μ–΄] 02 - μ˜€λ””μ˜€ & λΉ„λ””μ˜€ μž¬μƒν•˜κΈ° [HTML+CSS][HTML5와 λ©€ν‹°λ―Έλ””μ–΄] 01.. onelight-stay.tistory.com μ‚¬μš©μžμ˜ λ™μž‘μ— λ°˜μ‘ν•΄ ν…μŠ€νŠΈλ‚˜ 이미지 등을 μ›€μ§μ΄κ²Œ ν•  수 μžˆλŠ” λ³€ν˜•μ— λŒ€ν•΄μ„œ μ•Œμ•„λ³΄λ„λ‘ ν•˜μž. 2차원 λ³€ν˜•κ³Ό 3차원 λ³€ν˜• 2차원 λ³€ν˜• (2D transform) μ›Ή μš”μ†Œλ₯Ό λ³€ν˜•μ‹œν‚¬ λ•Œ λ‹¨μˆœνžˆ μˆ˜ν‰μ΄λ‚˜ 수직으둜 μ΄λ™ν•˜κ³  νšŒμ „ν•˜λŠ” 것을 λ§ν•˜λ©°, ν¬κΈ°λ‚˜ κ°λ„λ§ŒμœΌλ‘œ μ†μ‰½κ²Œ λ³€ν˜•μ΄ κ°€λŠ₯ν•˜λ‹€. x좕은 였λ₯Έμͺ½μœΌλ‘œ 갈수.. 2020. 7. 24.
[HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 04 - μ—°μŠ΅λ¬Έμ œ 01 이미지 μœ„λ‘œ 마우슀 포인터λ₯Ό μ˜¬λ €λ³΄μ„Έμš” 02 메뉴1 메뉴2 메뉴3 Do it! HTML5+CSS3 μ›Ή ν‘œμ€€μ˜ 정석 β€» ν•΄λ‹Ή 글은 μŠ΅λ“ λͺ©μ μœΌλ‘œ μž‘μ„±λœ κΈ€μž…λ‹ˆλ‹€ β€» 2020. 7. 23.
[HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 03 - 가상 ν΄λž˜μŠ€μ™€ 가상 μš”μ†Œ [HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 02 - 속성 μ„ νƒμž [HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 01 - μ—°κ²° μ„ νƒμž [HTML+CSS][HTML5와 λ©€ν‹°λ―Έλ””μ–΄] 02 - μ˜€λ””μ˜€ & λΉ„λ””μ˜€ μž¬μƒν•˜κΈ° [HTML+CSS][HTML5와 λ©€ν‹°λ―Έλ””μ–΄] 01 - μ›Ήκ³Ό λ©€ν‹°λ―Έλ””μ–΄ [HTML+CSS][HTML5와 μ‹œλ§¨ν‹±νƒœκ·Έ] 03.. onelight-stay.tistory.com νŠΉμ • ν•­λͺ©λ“€μ„ 손 μ‰½κ²Œ λ°”κΏ€ 수 μžˆλŠ” 가상 ν΄λž˜μŠ€μ™€ 가상 μš”μ†Œμ— λŒ€ν•΄μ„œ μ•Œμ•„λ³΄λ„λ‘ ν•˜μž. μ‚¬μš©μž λ™μž‘μ— λ°˜μ‘ν•˜λŠ” 가상 클래슀 :link 가상 클래슀 μ„ νƒμž λ¬Έμ„œ μ•ˆμ˜ ν•˜μ΄νΌλ§ν¬ μ€‘μ—μ„œ μ‚¬μš©μžκ°€ 아직 λ°©λ¬Έν•˜μ§€ μ•Šμ€ 링크에 μŠ€νƒ€μΌμ„ μ μš©ν•œλ‹€. :visited 가상 클래슀 μ„ νƒμž λ¬Έμ„œμ˜ 링크 μ€‘μ—μ„œ ν•œ 번 이상 λ°©λ¬Έν•œ 링크에 .. 2020. 7. 22.
[HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 02 - 속성 μ„ νƒμž [HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 01 - μ—°κ²° μ„ νƒμž [HTML+CSS][HTML5와 λ©€ν‹°λ―Έλ””μ–΄] 02 - μ˜€λ””μ˜€ & λΉ„λ””μ˜€ μž¬μƒν•˜κΈ° [HTML+CSS][HTML5와 λ©€ν‹°λ―Έλ””μ–΄] 01 - μ›Ήκ³Ό λ©€ν‹°λ―Έλ””μ–΄ [HTML+CSS][HTML5와 μ‹œλ§¨ν‹±νƒœκ·Έ] 03 - IE8 μ΄ν•˜ λ²„μ „μ—μ„œ μ‹œλ§¨ν‹±νƒœκ·Έ μ‚¬μš©ν•˜κΈ° [HTML+CSS][.. onelight-stay.tistory.com νƒœκ·Έ μ•ˆμ—μ„œ μ‚¬μš©ν•˜λŠ” μ†μ„±λ“€μ˜ 값에 따라 μŠ€νƒ€μΌμ΄ λ³€ν•˜λŠ” 속성 μ„ νƒμžμ— λŒ€ν•΄μ„œ μ•Œμ•„λ³΄λ„λ‘ ν•˜μž. [속성] μ„ νƒμž μ§€μ •ν•œ 속성을 가진 μš”μ†Œλ₯Ό μ°Ύμ•„ μŠ€νƒ€μΌμ„ μ μš©ν•˜λŠ” κ²ƒμœΌλ‘œ λŒ€κ΄„ν˜Έ([,]) 사이에 μ°ΎμœΌλ €λŠ” 속성을 μ§€μ •ν•˜λ©΄ λœλ‹€. [속성 = κ°’] μ„ νƒμž 주어진 속성과 속성 값이 μΌμΉ˜ν•˜λŠ” μš”μ†Œλ₯Ό μ°Ύμ•„ μŠ€νƒ€μΌμ„ μ μš©ν•˜λŠ” κ²ƒμœΌλ‘œ λŒ€κ΄„ν˜Έ.. 2020. 7. 21.
[HTML+CSS][λ‹€μž¬λ‹€λŠ₯ν•œ CSS3 μ„ νƒμž] 01 - μ—°κ²° μ„ νƒμž [HTML+CSS][HTML5와 λ©€ν‹°λ―Έλ””μ–΄] 02 - μ˜€λ””μ˜€ & λΉ„λ””μ˜€ μž¬μƒν•˜κΈ° [HTML+CSS][HTML5와 λ©€ν‹°λ―Έλ””μ–΄] 01 - μ›Ήκ³Ό λ©€ν‹°λ―Έλ””μ–΄ [HTML+CSS][HTML5와 μ‹œλ§¨ν‹±νƒœκ·Έ] 03 - IE8 μ΄ν•˜ λ²„μ „μ—μ„œ μ‹œλ§¨ν‹±νƒœκ·Έ μ‚¬μš©ν•˜κΈ° [HTML+CSS][HTML5와 μ‹œλ§¨ν‹±νƒœκ·Έ] 02 - μ‹œλ§¨ν‹± νƒœκ·Έμ˜ μ’…λ₯˜ [HTML+CSS][HTML5.. onelight-stay.tistory.com μ„ νƒμžμ™€ μ„ νƒμžλ₯Ό μ—°κ²°ν•΄ 적용 λŒ€μƒμ„ ν•œμ •μ‹œν‚€λŠ” 'μ—°κ²° μ„ νƒμž'에 λŒ€ν•΄μ„œ μ•Œμ•„λ³΄λ„λ‘ ν•˜μž. ν•˜μœ„ μ„ νƒμž : μ§€μ •ν•œ λͺ¨λ“  ν•˜μœ„ μš”μ†Œμ— μŠ€νƒ€μΌ 적용 ν•˜μœ„ μ„ νƒμž(descendant selector)λŠ” λΆ€λͺ¨ μš”μ†Œμ— ν¬ν•¨λœ ν•˜μœ„ μš”μ†Œ λͺ¨λ‘μ— μŠ€νƒ€μΌμ΄ μ μš©λ˜λŠ” κ²ƒμœΌλ‘œ 'μžμ† μ„ νƒμž'라고도 ν•œλ‹€. μžμ‹ μš”μ†ŒλΏλ§Œ μ•„λ‹ˆλΌ μ†μž.. 2020. 7. 18.

ν‹°μŠ€ν† λ¦¬νˆ΄λ°”