2021. 10. 9. 18:16ใHTML + CSS + JS
1. <form>..</form>
form์ ๋ํ์ ์ผ๋ก ์์ด๋์ ๋น๋ฐ๋ฒํธ๋ฅผ ์ ๋ ฅํ๋ form์ ์๋ก ๋ค์์๋ค.
form์๋ ๋ค์ํ ์์ฑ๋ค์ด ์กด์ฌํ๋ค.
1๏ธโฃ method: ์ฌ์ฉ์๊ฐ ์ ๋ ฅํ ๋ด์ฉ์ ์๋ฒ ์ชฝ ํ๋ก๊ทธ๋จ์ผ๋ก ์ด๋ป๊ฒ ๋๊ฒจ์ค ๊ฒ์ธ์ง ์ง์ ํ๋๊ฒ์ด๋ค.
-> get๊ณผ post๊ฐ ์๋ค.
- get : ๋ฐ์ดํฐ๋ฅผ 256 ~ 4096 byte ๊น์ง๋ง ์๋ฒ๋ก ๋๊ธธ ์ ์์ผ๋ฉฐ, ์ฃผ์ ํ์์ค์ ์ฌ์ฉ์๊ฐ ์ ๋ ฅํ ๋ด์ฉ์ด ๊ทธ๋๋ก ๋๋ฌ๋๋ ๋จ์ ์ด ์กด์ฌํ๋ค.
- post : ์ ๋ ฅํ ๋ด์ฉ์ ๊ธธ์ด์ ์ ํ๋ฐ์ง ์๊ณ ์ฌ์ฉ์๊ฐ ์ ๋ ฅํ ๋ด์ฉ๋ ๋๋ฌ๋์ง ์๋๋ค.
2๏ธโฃ name : ์๋ฐ ์คํฌ๋ฆฝํธ๋ก ํผ์ ์ ์ดํ ๋ ์ฌ์ฉํ ํผ์ ์ด๋ฆ์ ์ง์ ํ๋ค.
3๏ธโฃ action : <form> ํ๊ทธ ์์ ๋ด์ฉ์ ์ฒ๋ฆฌํด ์ค ์๋ฒ ํ๋ก๊ทธ๋จ์ ์ง์ ํ๋ค.
4๏ธโฃ target : action ์์์์ ์ง์ ํ ์คํฌ๋ฆฝํธ ํ์ผ์ ํ์ฌ ์ฐฝ์ด ์๋ ๋ค๋ฅธ ์์น์์ ์ด๋๋ก ํ๋ค.
5๏ธโฃ autocomplete ์์ฑ : ํผ์์ ๋ด์ฉ์ ์ ๋ ฅํ ๋ ์์ ์ ์ ๋ ฅํ ๋ด์ฉ์ ์๋์ผ๋ก ํ์ํด ์ฃผ๋ ๊ฒ์ ์๋ ์์ฑ ๊ธฐ๋ฅ์ด๋ผ๊ณ ํ๋ค.
์๋ ์์ฑ ๊ธฐ๋ฅ์ "on"์ผ๋ก ์ค์ ํ๋ฉด ๋๊ณ , ์ด๊ฒ ๊ธฐ๋ณธ ์์ฑ๊ฐ์ด๋ค.
ex) <form action= "" autocomplete ="on"> ... </form>
2. <fieldset> ... </fieldset>, <legend>..</legend>
ํ๋์ ํผ ์์์ ์ฌ๋ฌ ๊ตฌ์ญ์ผ๋ก ๋๋์ด ํ์ํ ๋ ์ฌ์ฉํ๋ ํ๊ทธ๊ฐ <fieldset> ํ๊ทธ์ด๋ค.
๊ทธ๋ฆฌ๊ณ <legend> ํ๊ทธ๋ฅผ ํตํด fieldset์ ์ ๋ชฉ์ ์ง์ ํด์ค๋ค.
3. <label>..</label>
<label> ํ๊ทธ๋ <input> ํ๊ทธ์ ๊ฐ์ด ํผ ์์์ ๋ ์ด๋ธ์ ๋ถ์ผ ๋ ์ฌ์ฉํ๋ค.
ํผ ์์์ id ๊ฐ์ label์ ์๋ ค์ค๋ค.
์ด ํ๊ทธ๋ฅผ ์ฌ์ฉํ๋ ์ด์ ๋ ๋ง์ฝ <input> ํ๊ทธ๊ฐ ๋จ์ด์ ธ์๋๋ผ๋ ์ฝ๊ฒ ์ฐ๊ฒฐํ ์ ์๊ธฐ ๋๋ฌธ์ด๋ค.
'HTML + CSS + JS' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
4-3. html input ํ๊ทธ ๊ฐ์ฅ ๋ง์ด ์ฌ์ฉํ๋ ์์ฑ (0) | 2021.10.09 |
---|---|
4-2. html input ํ๊ทธ ์์ฑ๋ค (0) | 2021.10.09 |
3-5. html ๊ธฐ์ด ์ฐ์ต๋ฌธ์ 1, 2 (0) | 2021.10.09 |
3-4. html ํ์ดํผ๋งํฌ ํ๊ทธ<a> (0) | 2021.10.09 |
3-3. html ์ค๋์ค์ ๋น๋์ค ํ๊ทธ (0) | 2021.10.09 |