๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
[HTML+CSS][CSS ๊ธฐ์ดˆ] 02 - ์ฃผ์š” ์„ ํƒ์ž [HTML+CSS][CSS ๊ธฐ์ดˆ] 01 - ์Šคํƒ€์ผ๊ณผ ์Šคํƒ€์ผ ์‹œํŠธ [HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 05 - ๋‹ค์–‘ํ•œ ํผ ์š”์†Œ๋“ค [HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 04 - ์—ฌ๋Ÿฌ ๋ฐ์ดํ„ฐ ๋‚˜์—ดํ•ด ๋ณด์—ฌ์ฃผ๊ธฐ ํƒœ๊ทธ์˜ ๋‹ค์–‘ํ•œ ์†์„ฑ" data-og-description="ํƒœ๊ทธ" data-og-description="[HTML+CSS][ํผ ๊ด€๋ จ ํƒœ.. onelight-stay.tistory.com ์•ž์—์„œ ๊ฐ„๋‹จํ•˜๊ฒŒ ์•Œ์•„๋ณด์•˜๋˜ ์„ ํƒ์ž์— ๋Œ€ํ•ด์„œ ์ข€ ๋” ์ž์„ธํžˆ ๊ณต๋ถ€ํ•ด ๋ณด์ž. ์ „์ฒด ์„ ํƒ์ž ์Šคํƒ€์ผ์„ ๋ชจ๋“  ์š”์†Œ์— ์ ์šฉํ•  ๋•Œ ์‚ฌ์šฉํ•˜๋ฉฐ ์„ ํƒ์ž์— *(๋ณ„ํ‘œ)๋ฅผ ์ ์–ด ์‚ฌ์šฉํ•œ๋‹ค. ์ „์ฒด ์„ ํƒ์ž ํŠน์ • ํƒœ๊ทธ๊ฐ€ ์‚ฌ์šฉ๋œ ์š”์†Œ์— ์Šคํƒ€์ผ์„ ์ ์šฉ ํ•œ๋‹ค. ํด๋ž˜์Šค ์„ ํƒ์ž ํŠน์ • ๋ถ€๋ถ„์—๋งŒ ์Šคํƒ€์ผ์„ ์ ์šฉํ•  ๋•Œ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด๋ฉฐ ํด๋ž˜์Šค ์•ž์— ๋ฐ˜๋“œ์‹œ ๋งˆ์นจํ‘œ(.)๋ฅผ .. 2020. 6. 23.
[HTML+CSS][CSS ๊ธฐ์ดˆ] 01 - ์Šคํƒ€์ผ๊ณผ ์Šคํƒ€์ผ ์‹œํŠธ [HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 05 - ๋‹ค์–‘ํ•œ ํผ ์š”์†Œ๋“ค [HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 04 - ์—ฌ๋Ÿฌ ๋ฐ์ดํ„ฐ ๋‚˜์—ดํ•ด ๋ณด์—ฌ์ฃผ๊ธฐ ํƒœ๊ทธ์˜ ๋‹ค์–‘ํ•œ ์†์„ฑ" data-og-description="ํƒœ๊ทธ" data-og-description="[HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 01 - ํผ(form) [HTML+CSS] [์ด๋ฏธ์ง€์™€ ํ•˜์ดํผ๋ง.. onelight-stay.tistory.com HTML์„ ์‚ฌ์šฉํ•ด ํผ ์š”์†Œ์— ๋Œ€ํ•ด์„œ ๋ฐฐ์› ๋‹ค๋ฉด ํ•ด๋‹น ์š”์†Œ๋“ค์„ ๋ณด๊ธฐ ์ข‹๊ฒŒ ๋””์ž์ธํ•˜๋Š” ์Šคํƒ€์ผ์— ๋Œ€ํ•ด์„œ ๋ฐฐ์›Œ๋ณด์ž. ์Šคํƒ€์ผ(Style) ์›น ๋ฌธ์„œ์—์„œ ์Šคํƒ€์ผ์ด๋ž€ HTML ๋ฌธ์„œ์—์„œ ์ž์ฃผ ์‚ฌ์šฉํ•˜๋Š” ๊ธ€๊ผด์ด๋‚˜ ์ƒ‰์ƒ, ์ •๋ ฌ, ๊ฐ ์š”์†Œ๋“ค์˜ ๋ฐฐ์น˜ ๋ฐฉ๋ฒ• ๋“ฑ ๋ฌธ์„œ์˜ ๊ฒ‰๋ชจ์Šต์„ ๊ฒฐ์ •์ง“๋Š” ๋‚ด์šฉ์ด๋‹ค. โ‘  ์›น ๋ฌธ์„œ์˜ ๋‚ด์šฉ๊ณผ ์ƒ๊ด€์—†์ด ๋””์ž์ธ๋งŒ ๋ฐ”๊ฟ€ ์ˆ˜ ์žˆ.. 2020. 6. 22.
[HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 06 - ์—ฐ์Šต๋ฌธ์ œ 01 ์˜ˆ์•ฝ ์ •๋ณด ์ด ๋ฆ„ ํœด๋Œ€ํฐ ์ด๋ฉ”์ผ 02 ํ”„๋ŸฐํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž ์ง€์›์„œ HTML, CSS, Javascript์— ๋Œ€ํ•œ ๊ธฐ์ˆ ์  ์ดํ•ด์™€ ๊ฒฝํ—˜์ด ์žˆ๋Š” ๋ถ„์„ ์ฐพ์Šต๋‹ˆ๋‹ค. ๊ฐœ์ธ์ •๋ณด ์ด๋ฆ„ ์—ฐ๋ฝ์ฒ˜ ์ง€์› ๋ถ„์•ผ ์›น ํผ๋ธ”๋ฆฌ์‹ฑ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๊ฐœ๋ฐœ ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ๊ฐœ์„  ์ง€์› ๋™๊ธฐ ์ ‘์ˆ˜ํ•˜๊ธฐ ๋‹ค์‹œ ์“ฐ๊ธฐ Do it! HTML5+CSS3 ์›น ํ‘œ์ค€์˜ ์ •์„ โ€ป ํ•ด๋‹น ๊ธ€์€ ์Šต๋“ ๋ชฉ์ ์œผ๋กœ ์ž‘์„ฑ๋œ ๊ธ€์ž…๋‹ˆ๋‹ค โ€ป 2020. 6. 21.
[HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 05 - ๋‹ค์–‘ํ•œ ํผ ์š”์†Œ๋“ค [HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 04 - ์—ฌ๋Ÿฌ ๋ฐ์ดํ„ฐ ๋‚˜์—ดํ•ด ๋ณด์—ฌ์ฃผ๊ธฐ ํƒœ๊ทธ์˜ ๋‹ค์–‘ํ•œ ์†์„ฑ" data-og-description="ํƒœ๊ทธ" data-og-description="[HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 01 - ํผ(form) [HTML+CSS] [์ด๋ฏธ์ง€์™€ ํ•˜์ดํผ๋งํฌ] 03 - SVG ์ด๋ฏธ์ง€ [HTML+CSS] [์ด๋ฏธ์ง€์™€ ํ•˜์ดํผ๋งํฌ] 02 - ๋ง.. onelight-stay.tistory.com ์•ž ์ „์— ๋ฐฐ์šด ํผ๋“ค๊ณผ ๋”๋ถˆ์–ด ๋”์šฑ ๋‹ค์–‘ํ•œ ํผ ์š”์†Œ๋“ค์— ๋Œ€ํ•ด ์•Œ์•„๋ณด์ž. - ๋ฒ„ํŠผ ํƒœ๊ทธ์—์„œ๋„ ๋ฒ„ํŠผ์„ ๋„ฃ์„ ์ˆ˜ ์žˆ์ง€๋งŒ ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•ด ๋ฒ„ํŠผ์„ ์‚ฝ์ž…ํ•  ์ˆ˜ ์žˆ๋‹ค. ๊ณผ์˜ ์ฐจ์ด์ ์€ ์€ ํƒœ๊ทธ ์ž์ฒด์—์„œ ์—ญํ• ์„ ํ™•์ธํ•  ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์— ํ™”๋ฉด ๋‚ญ๋…๊ธฐ์—์„œ ๋ฒ„ํŠผ์ด ์žˆ๋‹ค๋Š” ๊ฒƒ์„ ์ •ํ™•ํ•˜๊ฒŒ ์ „๋‹ฌํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ๋ฒ„ํŠผ์— ์•„์ด์ฝ˜๊ณผ ๋””์ž์ธ.. 2020. 6. 20.
[HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 04 - ์—ฌ๋Ÿฌ ๋ฐ์ดํ„ฐ ๋‚˜์—ดํ•ด ๋ณด์—ฌ์ฃผ๊ธฐ [HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 03 - ํƒœ๊ทธ์˜ ๋‹ค์–‘ํ•œ ์†์„ฑ ํƒœ๊ทธ" data-og-description="[HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 01 - ํผ(form) [HTML+CSS] [์ด๋ฏธ์ง€์™€ ํ•˜์ดํผ๋งํฌ] 03 - SVG ์ด๋ฏธ์ง€ [HTML+CSS] [์ด๋ฏธ์ง€์™€ ํ•˜์ดํผ๋งํฌ] 02 - ๋งํฌ ํƒœ๊ทธ [HTML+CSS] [์ด๋ฏธ์ง€์™€ ํ•˜์ดํผ๋งํฌ].. onelight-stay.tistory.com ํ•œ ์ค„์งœ๋ฆฌ ๋ฐ์ดํ„ฐ์— ์–ด๋Š ์ •๋„ ๋ฐฐ์›Œ๋ณด์•˜์œผ๋‹ˆ ์ด๋ฒˆ์—๋Š” ์—ฌ๋Ÿฌ ๋ฐ์ดํ„ฐ๋ฅผ ๋ณด๊ธฐ ์ข‹๊ฒŒ ๋‚˜์—ดํ•ด ๋ณด๋Š” ๊ฒƒ์— ๋Œ€ํ•ด์„œ ๋ฐฐ์›Œ๋ณด์ž. , , - ๋“œ๋กญ๋‹ค์šด ์‚ฌ์šฉ์ž๊ฐ€ ๋‚ด์šฉ์„ ์ž…๋ ฅํ•˜๋Š” ๊ฒƒ์ด ์•„๋‹ˆ๋ผ ์—ฌ๋Ÿฌ ์˜ต์…˜ ์ค‘์—์„œ ์„ ํƒํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋งŒ๋“  ๊ฒƒ์ด๋‹ค. ๋“œ๋กญ๋‹ค์šด ๋ชฉ๋ก์„ ์ œ์ž‘ํ•œ๋‹ค. ๋“œ๋กญ๋‹ค์šด ๋ชฉ๋ก์— ํ‘œ์‹œ๋˜๋Š” ์˜ต์…˜์„ ์ง€์ •ํ•œ๋‹ค. ๋“œ๋กญ๋‹ค์šด ๋ชฉ๋ก์—์„œ ์—ฌ๋Ÿฌํ•ญ๋ชฉ์„ ๋ช‡.. 2020. 6. 19.
[HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 03 - <input> ํƒœ๊ทธ์˜ ๋‹ค์–‘ํ•œ ์†์„ฑ [HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 02 - ์‚ฌ์šฉ์ž ์ž…๋ ฅ์„ ์œ„ํ•œ ํƒœ๊ทธ [HTML+CSS][ํผ ๊ด€๋ จ ํƒœ๊ทธ๋“ค] 01 - ํผ(form) [HTML+CSS] [์ด๋ฏธ์ง€์™€ ํ•˜์ดํผ๋งํฌ] 03 - SVG ์ด๋ฏธ์ง€ [HTML+CSS] [์ด๋ฏธ์ง€์™€ ํ•˜์ดํผ๋งํฌ] 02 - ๋งํฌ ํƒœ๊ทธ [HTML+CSS] [์ด๋ฏธ์ง€์™€ ํ•˜์ดํผ๋งํฌ] 01 - ์ด๋ฏธ์ง€ ํƒœ๊ทธ [HTML+CSS].. onelight-stay.tistory.com ํƒœ๊ทธ์˜ ํผ์„ ๋งŒ๋“œ๋Š” ๊ธฐ๋ณธ์ ์ธ ๊ฒƒ์— ๋Œ€ํ•ด์„œ ์•Œ์•˜์œผ๋‹ˆ ํ•„๋“œ๋ฅผ ์ข€ ๋” ์„ธ๋ฐ€ํ•˜๊ฒŒ ์กฐ์ •ํ•˜๋Š” ๊ฒƒ์— ๋Œ€ํ•ด์„œ ๋ฐฐ์›Œ๋ณด์ž. - autofocus ์†์„ฑ - ํ•ด๋‹น ์†์„ฑ์„ ์‚ฌ์šฉํ•  ๊ฒฝ์šฐ ํŽ˜์ด์ง€๋ฅผ ๋ถˆ๋Ÿฌ์˜ค์ž๋งˆ์ž ํผ์˜ ์š”์†Œ ์ค‘์—์„œ ์›ํ•˜๋Š” ์š”์†Œ์— ๋งˆ์šฐ์Šค ์ปค์„œ๋ฅผ ํ‘œ์‹œํ•  ์ˆ˜ ์žˆ๋‹ค. ์—ฌ๋ฆ„๋ฐฉํ•™ ํŠน๊ฐ• ์‹ ์ฒญ ์ˆ˜๊ฐ•๊ณผ๋ชฉ ์˜์–ดํšŒํ™”(์ดˆ๊ธ‰) ์‹ ์ฒญ์ž ์ด๋ฆ„ ํ•™๋ฒˆ ํ•™๊ณผ -.. 2020. 6. 18.

ํ‹ฐ์Šคํ† ๋ฆฌํˆด๋ฐ”