์ด ๊ธ์๋ ์ ํ์๊ฐ๋ก ์์ต๊ธ์ ์ป๋ ๋งํฌ๊ฐ ํฌํจ๋์ด ์์ต๋๋ค.
์ฟ ํก, ์๋ฆฌ์ ๊ฐ์ ์ดํ๋ฆฌ์์ดํธ ํ๋ก๊ทธ๋จ์ ์ฐธ์ฌํ๋ ค๋ฉด?
๋๋ผ์ ์ ์ฑ
์ด ๊ณ์ํด์ ๋ฐ๋๋ฉด์ ์ฟ ํก ํํธ๋์ค์ ๊ฐ์ด ์ดํ๋ฆฌ์์ดํธ ํ๋ก๊ทธ๋จ์
์ฐธ์ฌํ๋ ๋ฐฉ๋ฒ๋ ๊ณ์ํด์ ์
๋ฐ์ดํธ๋๊ณ ๋ณํํ๊ณ ์์ต๋๋ค. ๊ทธ์ค์์๋ ์ค์ํ์ง๋ง
๋์น๊ณ ๊ณ์๋ ๋ถ๋ถ์ด ๋ง์๋ฐ์. ์ดํ๋ฆฌ์์ดํธ(ํํธ๋์คํ๋)๋ฅผ ๊ธ๋ก ์์ฑํจ์
์์ด์ ๊ทธ ๋ด์ฉ์ ์๋ฆฌ๋ ๋ฌธ๊ตฌ๋ฅผ ๊ธ์ ๊ฐ์ฅ ์์ ์์ฑํด์ผํ๋ค๋ ์กฐ๊ฑด์ด ๋ถ์๋ค๋
์ ์
๋๋ค. ์ด์ ๋ ๋ธ๋ก๊ทธ ๊ธ ๊ฐ์ฅ ์์ ์ด ๋ฌธ๊ตฌ๋ฅผ ๋ฐ๋์ ์
๋ ฅํ๊ณ ์๊ฐํ๋ ๊ธ์
์ฐ๊ฑฐ๋ ๋งํฌ๋ฅผ ์ฝ์
ํด์ผ ํ๋ค๋ ์ ์
๋๋ค.
๊ทธ๋ฅ ํ์๋ฅผ ์ณ์ ์ ๋ ฅํ๋ฉด ๋์ง ์๋์?
๋ง์์. ๊ทธ๋ฅ ์
๋ ฅํ๋ฉด ๋์ฃ . ํ์ง๋ง ๊ธ์ ์์ฑํ๋๋ฐ ์์ด์ ์ด๋ฐ ๋ถ๋ถ๊น์ง
๊ณ์ํด์ ์ ๊ฒฝ์ฐ๋ฉด์ ๊ธ์ ์์ฑํ๋ ค๋ฉด ์๋น๋๋ ์ ์ ์ ์ธ ํผ๋ก๊ฐ๋ ์๋นํฉ๋๋ค.
๊ทธ๋ ๊ธฐ์ ์ฐ๋ฆฌ๋ ์๋?์ผ๋ก ์
๋ ฅ๋๋ ๋ฌธ๊ตฌ๊ฐ ์ ์คํ ํ์ํฉ๋๋ค. ์ฌ๊ธฐ์๋ ์
๋ ฅํ๋
๋ฐฉ๋ฒ 2๊ฐ์ง๋ฅผ ์๋ ค๋๋ฆฌ๋ ์์ ์๊ฒ ๋ง๋ ๋ฐฉ๋ฒ์ผ๋ก ์ดํ๋ฆฌ์์ดํธ ๋ฌธ๊ตฌ๋ฅผ ๋ฃ์ด๋ณด์ธ์.
์ดํ๋ฆฌ์์ดํธ ๋ฌธ๊ตฌ ์๋์ฝ์ ๋ฐฉ๋ฒ
์ฒซ๋ฒ์งธ, htmlํธ์ง์ผ๋ก ์ฝ๋ ์ฝ์ ํ๊ธฐ
html์ฝ๋๋ฅผ ๋ฃ์ด์ ๋ธ๋ก๊ทธ ๊ธ ์๋จ์ ๋ฌธ๊ตฌ๊ฐ ๋ํ๋๊ฒ ํ ์ ์์ต๋๋ค. ์๋์
์์๋๋ก ๋ฐ๋ผํด๋ณด์ธ์.
1. ๋ธ๋ก๊ทธ์ ๊ด๋ฆฌ์ํ์ด์ง์์
ํ
๋ง ๋ฉ๋ด๋ฅผ ํด๋ฆญํฉ๋๋ค.
2. ์ฐ์ธก์ ๋ด ํ
๋ง์์ ๋ฒํผ์ ๋๋ฅด๊ณ
HTMLํธ์ง ๋ฉ๋ด๋ฅผ ํด๋ฆญํฉ๋๋ค.
3.HTML ํธ์ง์ฐฝ์ด ๋ํ๋๋ฉด Ctrl+Fํค๋ฅผ ๋๋ฌ ํธ์ง์ฐฝ ์๋จ์ ๋์ค๋ ๊ฒ์์ฐฝ์์ Post Body Entry Content๋ฅผ ๊ฒ์ํฉ๋๋ค. ์ ์ ๋ธ๋ก๊ทธ ํ ๋ง์์๋ ๋๊ตฐ๋ฐ ๊ฐ์ ์์น๊ฐ ๋์ค๋๋ฐ ์ ๋ ๋๋ฒ์งธ ์์นํ ๋ถ๋ถ์ ์์น๋ก ์ฐพ์์ต๋๋ค. ์ฌ๊ธฐ ์๋์ ์ด๋ฏธ์ง๋ฅผ ํ์ธํ์๋ฉด <div class='post-body entry-content' id='post-body'>์๋์ ์ดํ๋ฆฌ์์ดํธ ๋ฌธ๊ตฌ html์ฝ๋๋ฅผ ์ฝ์ ํ์๋ฉด ๋ฉ๋๋ค.
์ดํ๋ฆฌ์์ดํธ ์ฝ๋
*์ฌ๊ธฐ์ ์ ๊น!
์์ 3๋ฒ ๋ด์ฉ์ ๊ฐ์์ ๋ธ๋ก๊ทธ ํ
๋ง๋ง๋ค ์์น๊ฐ ๋ฌ๋ผ์ง ์ ์์ต๋๋ค. ์ด ์์น๋ฅผ
์ฐพ๋๋ฐฉ๋ฒ์ด ๊ฐ์ฅ ํต์ฌ์ ์ธ ๋ด์ฉ์ธ๋ฐ ์ด ์์น๋ ํฌ๋กฌ๊ณผ ๊ฐ์ ๋ธ๋ผ์ฐ์ ์์ F12ํค๋ฅผ
๋๋ฌ ๋ธ๋ก๊ทธ๊ธ ํ๋๋ฅผ ๋์๋ ์ํ์์ ๋ธ๋ก๊ทธ ๋ณธ๋ฌธ์ ๊ฐ์ฅ ์๋จ๋ถ๋ถ์ ๋ง์ฐ์ค๋ก
ํด๋ฆญํ์ฌ ๋์ค๋ ๋ถ๋ถ์ ์ฝ๋์ด๋ฆ์ ์ฐพ์์ ์์ ๊ฐ์ด ์ ์ฉํด์ผํฉ๋๋ค. ์ด๋ถ๋ถ์ด
์ด๋ ต๋ค๋ฉด F12ํค ๊ฐ๋ฐ์๋ชจ๋๋ฅผ ์ด๋ป๊ฒ ์๋ํ๊ณ ์ฐพ์๋ณด๋์ง์ ๋ํ ๊ฒ์์ํด๋ณด๊ณ
์ฌ์ฉ๋ฐฉ๋ฒ์ ์ตํํ ์ ์ฉํด์ผ ํฉ๋๋ค.
|
F12ํค๋ก ๋ธ๋ผ์ฐ์ ์์ ์ด์ด๋ณธ ๊ฐ๋ฐ์๋ชจ๋์ ๋๋ค. |
4. ๋ณธ๋ฌธ์ ๋ํ๋๋ ๋ฌธ๊ตฌ๊ฐ ๋จ์ง ๊ธ์๋ก๋ง ๋ณด์ฌ์ง๋ ๊ฒ์ด ์๋ ๊น๋ํ
๋ผ์ด๋๋ฐ์ค์์ ํ
์คํธ๊ฐ ์์์ผ๋ฉด ์ข๊ฒ ๋ค๊ณ ์๊ฐํด์ ํ
์คํธ๋ฐ์ค๋ฅผ ๊พธ๋ฏธ๋
CSS์ฝ๋๋ฅผ ํจ๊ป ๋ฃ์ด์ค ๊น๋ํ๊ฒ ๋ณด์ฌ์ง๋ ๋ฌธ๊ตฌ๋ฅผ ์์ฑํ ์ ์์ต๋๋ค.
์ด๋ฅผ ์ํด์ ๋จผ์ htmlํธ์ง์ฐฝ์์ Ctrl+Fํค๋ก ๊ฒ์์ฐฝ์ ์ด๊ณ ์๋์ ์ด๋ฏธ์ง์
๊ฐ์ด }]]></b:skin> ์ ๋ฃ๊ณ ๊ฒ์ํ์ธ์. ํด๋น ์์น๊ฐ ๋์๋ค๋ฉด ๊ทธ
์ฝ๋ ๋ฐ๋ก์์ ์ํ๋ CSS์ฝ๋๋ฅผ ๋ถ์ฌ๋ฃ๊ธฐ ํ์๋ฉด ๋ฉ๋๋ค.
CSS์ฝ๋ ๋ณต์ฌํ๊ธฐ
์๋์ ์ด๋ฏธ์ง๋ฅผ ๋ณด์๋ฉด CSS์ฝ๋๊ฐ ๋ค์ด๊ฐ ๋ชจ์ต์ ๋ณผ ์ ์์ต๋๋ค.
๋๋ฒ์งธ, ๊ธ ํ ํ๋ฆฟ์ผ๋ก ์ค์ ํ๊ธฐ
์ด ๋ฐฉ๋ฒ์ ๊ตฌ๊ธ๋ธ๋ก๊ทธ์ ๊ธํ
ํ๋ฆฟ์ ์ฌ์ฉํ ๋ฌธ๊ตฌ ์
๋ ฅ๋ฐฉ๋ฒ์
๋๋ค. ์ด
๋ฐฉ๋ฒ์ ์์ ๋ฐฉ๋ฒ๋ณด๋ค๋ ๊ฐ๋จํ๋ ์์ ๋ฐฉ๋ฒ์ด ์ด๋ ต๋ค๊ณ ๋๋ผ์๋ ๋ถ์ ์ด
๋ฐฉ๋ฒ์ผ๋ก ๋์ ํด๋ณด์ธ์.
1. ๋ธ๋ก๊ทธ์ ๊ด๋ฆฌ์ํ์ด์ง์์ ์ค์ ๋ฉ๋ด๋ฅผ ํด๋ฆญํ์ธ์.
2. ์ฐ์ธก์ ๋์ค๋ ๋ฉ๋ด์์ ๊ธ → ๊ธ ํ
ํ๋ฆฟ์ ํด๋ฆญํ์ธ์.
3. ๋ํ๋๋ ๊ธ ํ
ํ๋ฆฟ์ฐฝ์ ๋ด๊ฐ ์
๋ ฅํ๊ณ ์ถ์ ๋ฌธ๊ตฌ๋ฅผ ๋ฃ์ผ๋ฉด ๋ฉ๋๋ค. ์ ๋ ์ด์ ์ ๊ตฌ๊ธ๋ธ๋ก๊ทธ์ ์๋๋ชฉ์ฐจ๊ฐ ์ ์ฉ๋๊ฒ ํ๋ ์ฝ๋๋ฅผ ๋ฃ์ด ๋์ด์ ์๋์ ๊ฐ์ด ๋ฌธ๊ตฌ๊ฐ ์ฝ์
๋์ด ์๋๊ฒ์
๋๋ค. ์ด ๋ฌธ๊ตฌ์ ์์ ์ถ๊ฐ๋ก ๋ด๊ฐ ์ํ๋ ์ฝ๋๋ฅผ ๋ฃ์ผ๋ฉด ๋ฉ๋๋ค.
์ดํ๋ฆฌ์์ดํธ html์ฝ๋ ๋ณต์ฌํ๊ธฐ
์ด๋ ๊ฒ ๋ด๊ฐ ์ํ๋ ๊ณณ์ ์ํ๋ ๋ฌธ๊ตฌ๋ฅผ ์ฝ์
ํ์ฌ ์กฐ๊ธ๋ ํธ๋ฆฌํ ๋ธ๋ก๊ทธ ๊ธ์ฐ๊ธฐ๋ฅผ ์์ํ ์ ์์ต๋๋ค. ์ต์ข
์ ์ผ๋ก๋ ๊ธ์ฐ๊ธฐ์ ๋ฐฉํด๊ฐ ๋๋ ๋ชจ๋ ์์๋ค์ ์ ๊ฑฐํจ์ผ๋ก์จ ์ค๋ก์ง ๊ธ์ฐ๊ธฐ์๋ง ์ง์คํ ์ ์๊ฒ ๋ด ๋ธ๋ก๊ทธ๋ฅผ ๋ค๋ฌ๋๊ฒ์
๋๋ค. ์ค๋์ ์ด ๋ฌธ๊ตฌํ๋๋ฅผ ์์ฑํ์ง๋ง ์ด๋ฐ ์์
์ด ์์ด๊ณ ์์ฌ์ ์ข๋ ์พ์ ํ๊ณ ๋ฉ์ง ๋ธ๋ก๊ทธ๋ฅผ ์์ฑํด๋๊ฐ ์ ์๊ฒ ์ต๋๋ค. ์ง๊ธ ์์ํด๋ณด์ธ์.
Tags
๊พธ๋ฏธ๊ธฐํ