Notice
Recent Posts
Recent Comments
Link
์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
Tags
- await
- object
- js
- eport
- slow and steady
- ํผํ
- mysql
- ๊ฒ์
- webpack
- json
- setTimeout()
- callback
- promise
- ์ฐธ๊ณ ๋ธ๋ก๊ทธ
- db
- Import
- database
- Project
- https://youtube.com/playlist?list=PLuHgQVnccGMA5836CvWfieEQy0T0ov6Jh&si=FTaYv8m21EhO-A2K
- sql
- ajax
- prj
- https://m.blog.naver.com/tt2t2am1118/221010125300
- JS #ํ๋ก์ ํธ
- async
- ๋๊ธฐ
- execCommand
- addEventListener
- Porject
- ๋น๋๊ธฐ
Archives
- Today
- Total
C-log
๐ Decorate from CSS : ๋ค์ํ ์ ํ์๋ค #7 ๋ณธ๋ฌธ
728x90
*ํด๋น ํฌ์คํ ์ CSS Diner ๊ฒ์์ ํตํด ๋ค์ํ ์ ํ์๋ค์ ์ฐ์ตํ๋ ๊ฒ์์ด๋ค. ๊ฐ์์์๋ ํด๋น ๊ฒ์์ ํด์คํด์ฃผ๋ ํ๋ฒ ํ์ด๋ณด๊ธธ ๊ถ์ฅํ๋ค.
7๋ฒ ๋ฌธ์ ๊ฐ ์ ํ๋ฆฌ์ง ์์๋๋ค. ์ฝ๋๋ ์๋์ ๊ฐ๋ค.
<div class="table">
<apple />
<apple class="small" />
<bento>
<orange class="small" />
</bento>
<plate>
<orange />
</plate>
<plate>
<orange class="small" />
</plate>
</div>
ํด๋น ์ฝ๋์์ bento ํ๊ทธ ์์ ์๋ orange๋ฅผ ์ ํํด์ผ ํ๋ค. ๊ทธ๋ฌ๊ธฐ ์ํด์ class table์ธ div๋ก ์ง์ ํ๊ณ bentoํ๊ทธ๋ก ์ง์ ํ class small์ธ orange์ ์ง์ ์ ํด์ผํ๋ค. ์์ธํ ๋ณด๋ฉด class small์ ๊ฐ์ง๊ณ ์๋ ๊ฒ์ orange๋ฟ๋ง ์๋๋ผ apple๋ ๊ฐ์ง๊ณ ์๋ค. ๊ทธ๋์ ๋ชจ๋ orange๋ฅผ ์ ํํ๊ณ ๊ทธ ์ค .small์ ์ง์ ํด์ฃผ๋ฉด ๋๋ค.
์ฆ, oragne.small ์ด๋ ๊ฒ ๋ง์ด๋ค.
728x90
'๐ CSS > โกver.0' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
๐ Decorate from CSS : Text - align (0) | 2024.02.18 |
---|---|
๐ Decorate from CSS : ๋ค์ํ ์ ํ์๋ค #12 (0) | 2024.02.13 |
๐ Decorate from CSS : font-size (0) | 2024.02.13 |
๐ Decorate from CSS : ๊ฐ์ ํด๋์ค ์ ํ์ (0) | 2024.02.13 |
๐ Decorate from CSS : ๋ถ๋ชจ ์์ ์ ํ์ (0) | 2024.02.13 |
Comments