TIL * 2022.01.31

RIHOΒ·2022λ…„ 1μ›” 31일
0

TIL

λͺ©λ‘ 보기
4/13
post-thumbnail
post-custom-banner

πŸ”· CSS

reset.css

  • μ‚¬μš©μžλ“€μ΄ λ™μΌν•œ κ²½ν—˜μ„ ν•  수 μžˆλ„λ‘ 크둜슀 λΈŒλΌμš°μ§• 원칙을 지킀기 μœ„ν•¨
  • λΈŒλΌμš°μ €λ§ˆλ‹€ νƒœκ·Έλ₯Ό λ Œλ”λ§ν•˜λŠ” κΈ°λ³Έ μŠ€νƒ€μΌμ΄ λ‹€λ₯΄λ‹€.
  • λͺ¨λ“  λΈŒλΌμš°μ €μ—μ„œ λ™μΌν•œ 화면을 λ³Ό 수 μžˆλ„λ‘ 기본값을 μ΄ˆκΈ°ν™”ν•œλ‹€.
  • reset.cssλŠ” 각 ν”„λ‘œμ νŠΈμ— λ§žμΆ”μ–΄ μ‚¬μš©ν•œλ‹€.

IR(image Replacement)

  • 이미지λ₯Ό λ³Ό 수 μ—†λŠ” μ‚¬μš©μžλ“€μ—κ²Œ μ μ ˆν•œ λŒ€μ²΄ ν…μŠ€νŠΈλ₯Ό μ œκ³΅ν•˜λŠ” 것
  • λ°°κ²½ μ΄λ―Έμ§€λ‘œ μ²˜λ¦¬ν•œ 의미 μžˆλŠ” μ•„μ΄μ½˜, 둜고, λŒ€μ²΄ ν…μŠ€νŠΈκ°€ λ„ˆλ¬΄ κΈ΄ 이벀트 νŽ˜μ΄μ§€μ—μ„œ 주둜 μ‚¬μš©

HTML: μ‹œλ§¨ν‹± λ§ˆν¬μ—… μœ μ§€
CSS: 슀크린 리더 인식, λ ˆμ΄μ•„μ›ƒκ³Ό μ„±λŠ₯에 영ν–₯이 μ—†μ–΄μ•Ό 함, .blind 클래슀 ν™œμš©


float의 ν•΄μ œ

  • float이 적용된 μš”μ†ŒλŠ” κ·Έ νλ¦„μ—μ„œ λ²—μ–΄λ‚˜μ„œ λ ˆμ΄μ•„μ›ƒμƒ λ„μ›Œμ§€κ²Œ λœλ‹€.
  • μ΄λŸ¬ν•œ νŠΉμ§• λ•Œλ¬Έμ— μ£Όλ³€μ˜ μš”μ†Œλ“€μ— 영ν–₯을 λΌμ³μ„œ μ›ν•˜λŠ” λŒ€λ‘œ λ…ΈμΆœλ˜μ§€ μ•Šμ„ μˆ˜λ„ μžˆλ‹€. μ΄λŸ¬ν•œ ν˜„μƒμ„ 막기 μœ„ν•΄ floatλ₯Ό ν•΄μ œν•œλ‹€.
  1. λΆ€λͺ¨ μš”μ†Œ height λΆ€μ—¬
  2. λΆ€λͺ¨ μš”μ†Œ float 속성 포함
  3. λΆ€λͺ¨ μš”μ†Œμ˜ overflow(visible μ œμ™Έ) 속성
  4. 뒀에 μΈμ ‘ν•˜λŠ” ν˜•μ œ μš”μ†Œμ˜ clear 속성
  5. 가상 μš”μ†Œλ₯Ό μ΄μš©ν•œ clear 속성

πŸ’» Today I made


상단 κ³ μ •ν˜• λ ˆμ΄μ•„μ›ƒ

닀단 λ ˆμ΄μ•„μ›ƒ

1단 λ ˆμ΄μ•„μ›ƒ

profile
RIHO
Front-End / 기둝용
이전 포슀트

TIL * 2022.01.30

λ‹€μŒ 포슀트

TIL * 22.02.04

post-custom-banner

0개의 λŒ“κΈ€