๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
IT

[CSS] ์šฐ์„ ์ˆœ์œ„

by ITyranno 2023. 8. 25.
728x90
๋ฐ˜์‘ํ˜•

 

ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์„ธ๊ณ„๋ฅผ ํƒ๊ตฌํ•ฉ์‹œ๋‹ค.

 

 

(1) ์Šคํƒ€์ผ ์šฐ์„ ์ˆœ์œ„

 

์Šคํƒ€์ผ ์ ์šฉ ์šฐ์„ ์ˆœ์œ„

1. !important

โ†“

2. ์ธ๋ผ์ธ ์Šคํƒ€์ผ

โ†“

3. id ์Šคํƒ€์ผ

โ†“

4. ํด๋ž˜์Šค ์Šคํƒ€์ผ

โ†“

5. ํƒ€์ž… ์Šคํƒ€์ผ

 

์„ ํƒ์ž ์ •๋ณด๋Š” ์•ž ํฌ์ŠคํŒ… ์ฐธ๊ณ 

2023.08.25 - [๋ถ„๋ฅ˜ ์ „์ฒด๋ณด๊ธฐ] - [CSS] ์„ ํƒ์ž

 

[CSS] ์„ ํƒ์ž

CSS๋Š” HTML ๋ฌธ์„œ๋ฅผ ๋””์ž์ธํ•˜๋Š” ์–ธ์–ด์ž…๋‹ˆ๋‹ค. ์ž‘์„ฑํ•œ HTML์˜ ํ…์ŠคํŠธ, ์ด๋ฏธ์ง€, ๋ฐฐ๊ฒฝ ํฌ๊ธฐ, ๋ฐฐ์น˜ ๋ฐฉ๋ฒ• ๋“ฑ์˜ ์š”์†Œ๋ฅผ ์„ค์ •ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. CSS์Šคํƒ€์ผ์˜ ๊ธฐ๋ณธ ํ˜•์‹์ž…๋‹ˆ๋‹ค. ์„ ํƒ์ž { ์†์„ฑ1: ์†์„ฑ๊ฐ’: ์†์„ฑ: ์†์„ฑ

ityranno.tistory.com

 

 

(2) ์Šคํƒ€์ผ ์ƒ์†

 

์„ ํƒ์ž HTML ์ฝ”๋“œ CSS ํ‘œํ˜„
ํ•˜์œ„ <a>
  <b>
    <a> <b>
a b { }
์ž์‹ <a>
  <b>
    <a> <b>
a > b { }
ํ˜•์ œ <a>
  <b>
    <a> <b>
           <a> <b>
a ~ b { }
์ธ์ ‘ํ˜•์ œ <a>
  <b>
    <a> <b>
            <a> <b>
a + b { }
๊ฐ€์ƒํด๋ž˜์Šค <parent>
  <a> <b> <b>
</parent>

<parent>
  <a><b><a><b><a><b><a>
</parent>
b:nth-child(2) { }

a:nth-of-type(2) { }
์ „์ฒด <a><b><c><d> *

 

 

 

 

 

 

 

728x90
๋ฐ˜์‘ํ˜•