๋ถ๋ฅ ์ ์ฒด๋ณด๊ธฐ (251) ์ธ๋ค์ผํ ๋ฆฌ์คํธํ ํฐ์คํ ๋ฆฌ ๋ธ๋ก๊ทธ ์คํจ ๊พธ๋ฏธ๊ธฐ [spanํ๊ทธ] ํ๊ทธ(1) ์ ์ ๋ ์ด์์์ ์ค์ ํ ๋ ์ฌ์ฉํ๋ ํ๊ทธ๋ก ํ๊ทธ์ ์ ์ฌํ์ง๋ง ์ฌ์ฉ๋ฐฉ๋ฒ์ ๋ค๋ฅด๋ค. ํ๊ทธ์ display์์ฑ์ inline์์์ด๋ฉฐ, ๋ฅผ ์ด์ฉํ ์ค๋ฐ๊ฟ์ด ๋์ง ์๋๋ค. ์๋ํ๋ฉด ์ผ์ง์ ์ผ๋ก ์ฌ์ฉ์์ ์ฐ๋ ํ๊ทธ์ด๊ธฐ ๋๋ฌธ์ด๋ค. ๋ฐ๋ฉด, ํ๊ทธ๋ ์ค๋ฐ๊ฟ์ด ๋๋ block์์๋ผ๊ณ ํ๋ค. (2) ์ฌ์ฉ๋ฒ ํ๊ทธ๋ ํผ์ ์ฌ์ฉํ์ง ์์ผ๋ฉฐ ์ฃผ๋ก CSS์์ฑ๋ค๊ณผ ํจ๊ป ์ฌ์ฉํ๋ค. : ์์, ์คํ ํ๊ทธ : ์ข ๋ฃ, ํด๋ก์ฆ ํ๊ทธ ํ์ฌ ์์ฑ ์ค์ธ ์ด๋ฌํ ๋ฌธ์ฅ๋ค์ ๊พธ๋ฐ๋ ๋ง์ด ์ฌ์ฉ๋์ด ์ง๋ค. ์์) : ์์, ์คํ ํ๊ทธ : ์ข ๋ฃ, ํด๋ก์ฆ ํ๊ทธ (3) ์ค์ต ATOM ์ผ๋ก ์ด์ฉํ์ฌ spanํ๊ทธ๋ฅผ ์ค์ต ํด๋ณด์. ์์ ๊ฐ์ด HTML์ ์ง์ CSS๋ฅผ ์ ์ฉํ ๋ ์ฌ์ฉํ๋ style์์๋ฅผ ํ๊ทธ์ ํจ๊ป ์ฌ์ฉํ์ฌ ๊ธ์จ ๋ค์ ๋ฐฐ๊ฒฝ์.. ๋ด ๋ง๋๋ก ํญ์ค๋ฐ๊ฒ ํฌ์๋ vs ์ ๋ค์์ค GV80 ํญ์ค๋ฐ๊ฒ ํฌ์๋ VS ์ ๋ค์์ค GV80 ํซํ ํ๋๊ทธ์ฝ SUV ๋ ์ข ์ ์ดํด๋ณด๋ ค๊ณ ํ๋๋ฐ์, ๋ฐ๋ก ํญ์ค๋ฐ๊ฒ ํฌ์๋ ๊ณผ ์ ๋ค์์ค GV80์ ๋๋ค. ๋ ์ฐจ ๋ชจ๋ ์ฒ์ ์ถ์ํ ๋์ ๊ฐ๊ฒฉ์์ ์ด์ง ์กฐ์ ๋ ๊ฐ๊ฒฉ์ผ๋ก ๋ค์ด*์์ ์ ๋ณด๊ฐ ๊ณต๊ฐ๋๊ณ ์๋๋ฐ์. (1) ์ธ๋ถ3์ธ๋ ํฌ์๋ ์ 2์ธ๋๋์ ํ์์ ์กฐ๊ธ์ฉ ๋์์ธ์ ์์ ํ๋ฉด์ ์๋ก์ด ํญ์ค๋ฐ๊ฒ์ ํจ๋ฐ๋ฆฌ๋ฃฉ์ ๋ง์ถฐ๊ทธ๋ฆด๊ณผ ๋ผ์ดํธ๋ฅผ ์ผ์ง์ ์ผ๋ก ์ด์ด ๋์๋ฏํ ๋์์ธ์ผ๋ก ๊ต์ฅํ ๋์ด๋ณด์ด๋ ๋์์ธ์ผ๋ก ๋์์์ต๋๋ค.GV80์ ๊ฐํน ๋ฒคํ๋ฆฌ์ ๋ฒคํ ์ด๊ฐ์ ๋ฎ์๋ค๋ ์ด์ผ๊ธฐ๋ค์ด ๋์ค๋๋ฐ, ๋ง์ ๋์ด ๋น๊ตํ๋ฉด ์ ํ ๋ฎ์ง์์๋๋ฐ ๋ง์ด์ฃ ~์๋ง๋ ๊ทธ๋ฆด์ ๊ฐ์ด๋ฐ์ ์์นํ ์ฐ๋ธ๋ผ์ด ์ ์ฌํด์? ๊ทธ๋ฐ๊ฒ ๊ฐ์ต๋๋ค.์ ๋ค์์ค GV80์ด ์ข ๋ ํฐ ์ฌ์ด์ฆ๋ต๊ฒ ํ๋ฉด ์ค๋ฒํ์ด ๋ ๊ธธ์ด๋ณด์ด๋ค์. ๋ท์ข์์ด ๋๋ํ ๊ฒ์ผ๋ก ์๊ฐ์ด.. ํฐ์คํ ๋ฆฌ ๋ธ๋ก๊ทธ ์คํจ ๊พธ๋ฏธ๊ธฐ [brํ๊ทธ] ํ๊ทธ(1) ์ ์ ์ค๋ฐ๊ฟ์ ํ ๋ ์ฌ์ฉํ๋ ํ๊ทธ๋ก line break์ ์ฝ์๋ผ๊ณ ํ๋ค.๊ทธ๋ฆฌ๊ณ ์ข ๋ฃํ๊ทธ๊ฐ ์๋ ๋น ํ๊ทธ์ด๊ธฐ๋ ํ๋ค. (2) ์ฌ์ฉ๋ฒ ์์ฑํ ํ ์คํธ ๋ค์์ ํ๊ทธ๋ฅผ ์ด์ด ์ค๋ฐ๊ฟ์ ์ฌ์ฉํด ์ฃผ๊ธฐ๋ง ํ๋ฉด ๋๋ค. : ์์, ์คํ ํ๊ทธ์์ : ์ข ๋ฃ, ํด๋ก์ฆ ํ๊ทธ ํ๊ทธ์ ํจ๊ป ์ฌ์ฉํ๋ฉด? (3) ์ค์ต ATOM ์ผ๋ก ์ด์ฉํ์ฌ brํ๊ทธ๋ฅผ ์ค์ต ํด๋ณด์์~ ๊ฒฐ๊ณผ๋? ์ ์ฒ๋ผ ์ถ๋ ฅ์ด ๋๋๊ตฐ์. ์ค๋์ ์ฌ๊ธฐ๊น์ง... ์ด์ด๋ณด๊ธฐ โ ํฐ์คํ ๋ฆฌ ๋ธ๋ก๊ทธ ์คํจ ๊พธ๋ฏธ๊ธฐ [spanํ๊ทธ] ๋ด ๋ง๋๋ก ์ ๋ค์์ค GV80 vs ๋ณผ๋ณด XC90 ์ ๋ค์์ค GV80 VS ๋ณผ๋ณด XC90 ์ค๋์ ๊ตญ๋ด ํ๋ฆฌ๋ฏธ์ ํ๋๊ทธ์ฝ SUV์ธ ์ ๋ค์์ค์ GV80๊ณผ ์์ ์ ๋๋ช ์ฌ ๋ณผ๋ณด์ ํ๋๊ทธ์ฝ ๋ชจ๋ธ์ธ XC90์ ์ดํด๋ณด๋ ค๊ณ ํฉ๋๋ค. (1) ์ธ๋ถGV80์ ์ ๋ฉด๋ถ ๊ทธ๋ฆด์ ์ด๋ํ ์ฌ์ด์ฆ๋ก ๊ตฌ์ฑ์ ํ์ฌ ์ ์ฅํ๊ธฐ๊น์ง ํฉ๋๋ค. ๋ํ๋ธ์ ์ด๋ ์ฑ๋์์ ํ๋์ฐจ์ ๋์์ธ ์ผํฐ์ฅ ์ด์์ฝ ์ ๋ฌด๋ ๊ทธ๋ฆด์ ์ด๋ฏธ์ง๋ฅผ ํตํด ๋ธ๋๋์ ์์ง์ ์ธ ์๋ฏธ๋ฅผ ๋ถ์ฌํ๋ ๊ฒ์ ๋ถ์ ์ ์ธ ๋ฐ์ธ์ ํ ๋ด์ฉ์ ๋ณธ์ ์ด ์๋๋ฐ์, ๊ทธ์ ๋ง๊ณผ ์๋ฐ๋๋ ๋์ ๋๋ ๊ทธ๋ฆด๋ก ๋ณด์ ๋๋ค. ์บ๋๋ฝ ๋ธ๋๋์ ๊ทธ๋ฆด๋ ์ฐ์์ด ๋ฉ๋๋ค.๋ฐ๋ฉด, ์ผ๊ด์ฑ ์๊ฒ ๋์์ธ์ ๊ตฌ์ถํด์ค๊ณ ์๋ ํ ๋ณผ๋ณด์ ์ฐจ๋ค์ ํ์ฌ์ ๋ณผ๋ณด์ ์ธ๊ธฐ์ ํ๋ชฉํ๋ค๊ณ ์๊ฐ์ด ๋ญ๋๋ค. ์ํ์ด์. ์ง์ง์ง.์ ๋ค์์ค์ ์ด๋ฏธ์ง๋ ๋์ค์ ๊ฐ์กฐํ ํค๋๋ผ์ดํธ์ ๋ฆฌ์ด๋จํ ๋ฑ์ผ๋ก ์ด์ด์ง ๋ชจ์ต์ ๋ณผ.. ํฐ์คํ ๋ฆฌ ๋ธ๋ก๊ทธ ์คํจ ๊พธ๋ฏธ๊ธฐ [aํ๊ทธ] ํ๊ทธ(1) ์ ์ ํ์ดํผ๋งํฌ๋ฅผ ๊ฑธ์ด์ค๋ ์ฌ์ฉํ๋ ํ๊ทธ๋ก anchor(๋ป)์ ์ค์๋ง์ด๋ผ๊ณ ํ๋ค. (2) ์ฌ์ฉ๋ฒ ํ๊ทธ๋ ํ๊ทธ์ฒ๋ผ ํผ์ ์ฌ์ฉํ์ง ์๊ณ "์์ฑ"์ด๋ผ๋ ๊ฒ๊ณผ ํจ๊ป ์ฌ์ฉํด์ผ ํ๋ค.์์ ํ๊ทธ์ธ ์ ์์ "์์ฑ"๊ณผ "์์ฑ๊ฐ"์ ๊ธฐ์ฌ ํ "์ฝํ ์ธ ", ๊ทธ๋ฆฌ๊ณ ๋ง์ง๋ง์ ์ข ๋ฃ ํ๊ทธ๋ฅผ ๋ฌ์ ์ฃผ๋ฉด ๋๋ค. : ์์, ์คํ ํ๊ทธ : ์ข ๋ฃ, ํด๋ก์ฆ ํ๊ทธ ์ฌ๊ธฐ์ "์์ฑ"์ href์ target ๊ทธ๋ฆฌ๊ณ id ์ธ๊ฐ์ง๊ฐ ์๋ค.โถ href : ํด๋ฆญ์ ์ด๋ ํ ๋งํฌโถ target : ๋งํฌ๋ฅผ ์ฌ๋ ๋ฐฉ๋ฒโถ id : ์ฑ ๊ฐํผ ์ญํ (๋ด๋ถ ๋งํฌ)(๊ณผ๊ฑฐ name ์์ฑ์ ์ญํ ์ด HTML5๊ฐ ๋๋ฉด์ ํ์ง๋๋ฉด์ ๋์ฒด๋ก ์ฌ์ฉ๋๋ค๊ณ ํจ.) ์ฌ๊ธฐ์ "์์ฑ๊ฐ"์ _self, _blank, _parent, _top ๋ฑ์ผ๋ก ์กด์ฌํ๋๋ฐ,โถ _self : ํ์ฌ .. ํฐ์คํ ๋ฆฌ ๋ธ๋ก๊ทธ ์คํจ ๊พธ๋ฏธ๊ธฐ [pํ๊ทธ] ํ๊ทธ (1) ์ ์ ๋จ๋ฝ์ ํํํ ๋ ์ฌ์ฉํ๋ ํ๊ทธ๋ก paragraph(๋จ๋ฝ)์ ์ค์๋ง์ด๋ผ๊ณ ํ๋ค. (2) ์ฌ์ฉ๋ฒ ์ ์ฌ์ด์ ์ฐ๊ณ ์ํ๋ ๋ด์ฉ์ ๊ธฐ์ฌํ๋ฉด ๋๋ค. : ์์, ์คํ ํ๊ทธ : ์ข ๋ฃ, ํด๋ก์ฆ ํ๊ทธ (3) ์ค์ต ATOM ์ผ๋ก ์ด์ฉํ์ฌ pํ๊ทธ๋ฅผ ์ค์ต ํด๋ณด์. .html ํ์ผ๋ก ์ ์ฅ ํ ๊ฒฐ๊ณผ ๊น๋ํ๊ฒ ์ถ๋ ฅ๋๋ ๋ชจ์ต์ ๋ณผ ์ ์์๋ค.๋ฟ๋ฏํ๋ค. ๊ทธ๋ ๋ค๋ฉด ํ์ค ๋ ์ถ๊ฐํด ๋ณด์. ์์ ์ค์ตํด๋ณธ pํ๊ทธ ๋ฐ์ ํ์ค ์ถ๊ฐํ์ฌ ํ์ธํ๋ ค ํ๋๋ฐ, ๊ถ๊ธํด์ ์์๋ ์จ๋ดค๋ค. ์ค..pํ๊ทธ๋ฅผ ๋ฐ์ ์ถ๊ฐํ๋ ๋ฐ์ ๊ธ์ด ์จ์ก๋ค.๊ถ๊ธํด์์์ ์ผ๋ pํ๊ทธ๋ ๊ทธ ๋ฐ์ ๊ธ์ด ์จ์ก๋ค. ๊ตฟ ์ด์ด๋ณด๊ธฐ โ [HTML] ์์ด๋ณด์ aํ๊ทธ ์ฌ์ฉ ์ด์ 1 ยทยทยท 10 11 12 13 14 15 16 ยทยทยท 42 ๋ค์