상세 컨텐츠

λ³Έλ¬Έ 제λͺ©

[ν…Œν‚· 1207] νŠΉκ°•, CSS

Project Log

by loeybho 2023. 12. 8. 08:22

λ³Έλ¬Έ

πŸ‘©‍πŸ’» μ•„μΉ¨ 자슡:: Javascript

객체 κ³ κΈ‰

11. 상속(extends) μ€‘λ³΅λ˜λŠ” μ½”λ“œλ₯Ό μƒμ†ν•˜μ—¬ λͺ¨λ‘ μ€„μ΄λŠ” 것

12. super λΆ€λͺ¨κ°€ 가지고 μžˆλŠ” κΈ°λŠ₯을 μ‚¬μš©ν•  수 μžˆλŠ” 것(super.sum)

 

πŸ‘©‍🎀 μˆ˜μ—… μ‹œμž‘:: νŠΉκ°•, CSS

μŠ€ν”„λ¦°νŠΈ 회고 νŠΉκ°•

μ–‘μΉ˜μ§ˆμ„ λͺ»ν•œλ‹€κ³  ν˜Όλ‚˜λŠ” 이유? ν”Όλ“œλ°±μ„ 1년에 1-2번 λ°›κΈ° λ•Œλ¬Έμ— ꡐ정할 κΈ°νšŒκ°€ 1-2번 밖에 μ•ˆλœλ‹€.

λ‚˜λ§Œμ˜ 색깔은 λ‚˜μ—κ²Œ λ°©ν–₯성을 μœ„ν•œ λ‚˜μΉ¨λ°˜μ΄ 되고, λ‹€λ₯Έ μ‚¬λžŒλ“€μ—κ²ŒλŠ” μ˜κ°μ„ μ€€λ‹€.

ν›Œλ₯­ν•œ μ—”μ§€λ‹ˆμ–΄λž€?

1. 쒋은 μ½”λ“œλ₯Ό μ§ λ‹€.(μ˜λ„λ₯Ό λ“œλŸ¬λ‚΄λŠ” 넀이밍, μž¬μ‚¬μš©μ„±μ΄ 높은 μ½”λ“œ, μ„±λŠ₯을 κ³ λ €ν•œ 섀계, 버그 μ΅œμ†Œν™”, μ˜λ―ΈμžˆλŠ” ν…ŒμŠ€νŠΈ μ½”λ“œ)

2. μž‘μ—…μ˜ ν˜„μž¬ κ°€μΉ˜λ₯Ό κ·ΉλŒ€ν™”ν•œλ‹€.(적은 μ½”λ“œ, μ½”λ“œ 없이 문제λ₯Ό ν•΄κ²°ν•˜κ³  κΈ°λŠ₯을 λ™μž‘ν•˜λŠ” ν”„λ‘œκ·Έλž¨μ„ λ§Œλ“œλŠ” μ—­λŸ‰)

3. 데이터에 κΈ°λ°˜ν•˜μ—¬ μ˜μ‚¬ κ²°μ • ν•œλ‹€. 

4. λ™λ£Œμ˜ 효과적인 μ˜μ‚¬ 결정을 λ•λŠ”λ‹€.

5. κΎΈμ€€νžˆ ν•™μŠ΅ν•œλ‹€ (λ‚˜λ§Œμ˜ λ˜‘λ˜‘ν•œ ν•™μŠ΅ 방식과 체계가 λ§Œλ“€μ–΄μ§€κ³  μžˆλŠ”κ°€?, μ΄μ „μ˜ κ²½ν—˜ μ†μ—μ„œ μ–΄λ–»κ²Œ λ‚΄κ°€ 효과적으둜 ν•™μŠ΅ν•˜λ €κ³  ν–ˆλŠ”μ§€?)

 

재미 => μ—λ„ˆμ§€

μž˜ν•˜λŠ” μ‚¬λžŒλ“€μ€ μžμ‹ μ΄ ν•˜λŠ” 것듀을 μ’‹μ•„ν•˜κ³  재밌게 λ§Œλ“€κ³ , 크게 κ΄΄λ‘œμ›Œ ν•˜μ§€ μ•ŠλŠ”λ‹€.

핡심은 μ’‹μ•„ν• λ§Œν•œ μž¬λ°Œμ„λ§Œν•œ μš”μ†Œλ₯Ό λ””μžμΈ ν•΄μ„œ ν•™μŠ΅κ³Ό μ„±μž₯ 과정에 λ…Ήμ—¬λ‚΄λŠ” 포인트(λ‚΄κ°€ μ’‹μ•„ν•˜λŠ” μ‚¬λžŒμ΄λž‘ 같이 ν•˜λŠ” κ±°)

 

μ „λ¬Έμ„±

μ–΄λ–»κ²Œ ν•˜λ©΄ 더 λ˜‘λ˜‘ν•˜κ²Œ 올릴 수 μžˆμ„κΉŒ?

λ‚˜λ§Œμ˜ κ²½ν—˜κ³Ό 방법을 λ§Œλ“€μ–΄κ°€κΈ°.

암묡지와 λͺ…λͺ©μ§€ 2가지λ₯Ό 같이 μŠ΅λ“ν•˜λ €κ³  ν•΄μ•Όν•œλ‹€.

암묡지: λ§λ‘œν•˜κΈ° μ–΄λ €μš΄ 것듀. μžμ „κ±° νƒˆ λ•Œ κ· ν˜•μ„ μž‘λŠ” λŠλ‚Œμ΄λ‚˜ νŽ˜λ‹¬μ„ λ°ŸλŠ” 감각.

- 버그λ₯Ό λ°œκ²¬ν•˜λŠ” κ³Όμ •μ΄λ‚˜ μ „λž΅, ꡬ글링 ν•˜λŠ” 방법과 μ „λž΅

λͺ…λͺ©μ§€: μ±…μ΄λ‚˜ κΈ€λ‘œ μ •λ¦¬λœ 것듀, λ ˆμ‹œν”Ό

 

μ•ˆμ „μ„±

루틴이 μ•ˆμ •μ μ΄κΈ° λ•Œλ¬Έ,μ–΄λ–»κ²Œ ν•˜λ©΄ λ˜‘λ˜‘ν•˜κ²Œ μŠ΅κ΄€μ„ λ§Œλ“€ 수 μžˆμ„κΉŒ

 

회볡, 건강

νšŒλ³΅νƒ„λ ₯μ„±

λŠ₯동적인 νœ΄μ‹ λ ˆνŒŒν† λ¦¬λ₯Ό λ§Œλ“€ 수 μžˆλŠ” 게 μ€‘μš”. λ‚΄κ°€ 뭘 ν•˜κ³  λ‚˜λ©΄ μ—λ„ˆμ§€κ°€ μ˜¬λΌκ°€λŠ”κ°€? (λ°©μ²­μ†Œ, μ‚°μ±…, μš”λ¦¬ λ“±)

 

CSS μˆ˜μ—…

μ΄ˆκΈ°κ°’ μ–΄λ–»κ²Œ μ„€μ •??

body {

 margin: initial; λͺ…μ‹œμ μœΌλ‘œ ν‘œκΈ°ν•¨μœΌλ‘œμ¨ λ‚΄ μ˜λ„λ₯Ό λͺ…ν™•νžˆ ν•œλ‹€.

}

 

 

.div {

}

=> μ•žμ— * (universal selector) 이 μƒλž΅λ˜μ–΄μžˆλ‹€. κ·Έλž˜μ„œ CSSμ—μ„œ .divλ₯Ό μž…λ ₯ν•˜λ©΄ div μ „λΆ€λ₯Ό λΆˆλŸ¬μ˜€λŠ” 것.

 

.wrap = any wrap

div.wrap = div wrap

 

<header>와 <footer>λŠ” μ—¬λŸ¬λ²ˆ μž‘μ„±ν•  수 μžˆλŠ” νƒœκ·Έμ΄λ‹€. λ•Œλ¬Έμ— class둜 λ¬Άμ–΄μ£Όκ³ , λͺ…λͺ…ν•  ν•„μš”κ°€ μžˆλ‹€. 

 

inherit, initial, unset

inherit: 상속 받을 게

initial: μ΄ˆκΈ°κ°’μœΌλ‘œ ν• κ²Œ

unset: 상속을 λ°›λŠ” κ±°λ©΄ λ°›κ³ , μ•„λ‹ˆλ©΄ μ΄ˆκΈ°κ°’ ν• κ²Œ.

 

descendant combinator

 

'Project Log' μΉ΄ν…Œκ³ λ¦¬μ˜ λ‹€λ₯Έ κΈ€

[1214 ν…Œν‚·] CSS :: Flex μ •λ³΅ν•˜κΈ°  (0) 2023.12.14
[1213 ν…Œν‚·]  (0) 2023.12.14
[ν…Œν‚· 1211] CSS  (1) 2023.12.11
[ν…Œν‚· 1206] CSS box model  (2) 2023.12.07
[ν…Œν‚·] 1205  (0) 2023.12.06

κ΄€λ ¨κΈ€ 더보기