[HTML] w3schools Exercise

Updated:

์›น ํ”„๋กœ๊ทธ๋ž˜๋ฐ Quiz #1 ๋Œ€๋น„ Exercise ํ‹€๋ฆฐ ๋ฌธ์ œ ๋ชจ์Œ


  1. ์ˆ˜ํ‰์„ , ๊ตฌ๋ถ„์„ ์€ <hr>์„ ์‚ฌ์šฉํ•˜๋ฉฐ ๋‹ซ๋Š” ํƒœ๊ทธ๋Š” ์—†๋‹ค.


  2. ์ž…๋ ฅ ํ•œ ๊ทธ๋Œ€๋กœ๋ฅผ ๋ณด์—ฌ์ฃผ๋Š” ํƒœ๊ทธ๋Š” <pre> </pre> ์ด๋‹ค.


  3. <p>ํƒœ๊ทธ์—์„œ ๊ฐ€์šด๋ฐ ์ •๋ ฌ์€ <p style="text-align: center"> ์ด๋‹ค.


  4. ๊ฐ•์กฐ๋Š” <strong> <b> ๋‘˜ ๋‹ค.. ํ•˜์ง€๋งŒ ํฐ ์ฐจ์ด๊ฐ€ ์žˆ๋‹ค.

    ๋ฐ”๋กœ <strong>์€ ์›น ํŽ˜์ด์ง€๊ฐ€ ์ •๋ง ์ค‘์š”ํ•œ ๋ถ€๋ถ„์ด๋ผ๊ณ  ์ธ์‹์„ ํ•˜๋Š” ๋ฐ˜๋ฉด

    <b>๋Š” ํ•ด๋‹น ํ…์ŠคํŠธ๋ฅผ Bold ์ฒ˜๋ฆฌ ํ•œ ๊ฒƒ์ด๋‹ค.


  5. emphasize๋Š” <em> </em> ์ด๋‹ค. ์ด๊ฒƒ๋„ <i> </i>์™€ ํฐ ์ฐจ์ด๊ฐ€ ์žˆ๋‹ค.

    <em>์€ ์›น ํŽ˜์ด์ง€๊ฐ€ ๊ฐ•์กฐํ•˜๋Š” ๋ถ€๋ถ„์ด๋ผ๊ณ  ์ธ์‹์„ ํ•˜๋Š” ๋ฐ˜๋ฉด

    <i>๋Š” ํ•ด๋‹น ํ…์ŠคํŠธ๋ฅผ ๊ธฐ์šธ์ด๊ธฐ ์ฒ˜๋ฆฌ ํ•œ ๊ฒƒ์ด๋‹ค.


  6. H2O ์•„๋ž˜ ์ฒจ์ž๋Š” <sub> </sub> ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.


  7. blue ์ทจ์†Œ์„ ์€ <del> </del> ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.


  8. Hello <q> </q>


  9. text๊ฐ€ ๊ธด ์ธ์šฉ๋ฌธ์€ <blockquote cite="link"> ~ </blockquote> ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.


  10. ๊ธ€์”จ๊ฐ€ ์จ์ง€๋Š” ๋ฐฉํ–ฅ ์ง€์ •์€ <bdo dir="rtl"> ~ </bdo> ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.

    ex ) ์ด๋ ‡๊ฒŒ ํ•˜๋ฉด ๊ฑฐ๊พธ๋กœ ์จ์ง€์ง€์šฉ?


  11. ์ค„์ž„๋ง ํ‘œ์‹œ๋Š” <abbr title="์ค„์ด๊ธฐ ์ „ ๋‹จ์–ด">์ค„์ธ ๋‹จ์–ด</abbr> ๋งˆ์šฐ์Šค๋ฅผ ์˜ฌ๋ ค๋ณด๋ฉด ์ค„์ด๊ธฐ ์ „ ๋‹จ์–ด๊ฐ€ ๋ณด์ธ๋‹ค.

    ex ) WHO


  12. <a href="https://nam-ki-bok.github.io" style="text-decoration:none"> ~ </a> ๋งํฌ ๋ฐ‘์ค„ ์—†์• ๊ธฐ


  13. <a href="https://nam-ki-bok.github.io" target="_blank"> ~ </a> ๋งํฌ ํด๋ฆญ ์‹œ ์ƒˆ์ฐฝ์œผ๋กœ ๋„์šฐ๊ธฐ


  14. ํ‘œ์˜ ์ œ๋ชฉ์€ <caption> </caption> ์ด๋‹ค.


  15. <ul>์˜ ๋ชจ์–‘์„ ๋ฐ”๊พธ๋ ค๋ฉด <ul style="list-style-type: square">


  16. <ol>์˜ ์ˆซ์ž๋ฅผ ๋ฐ”๊พธ๋ ค๋ฉด <ol type="A, a, I, i">


  17. ์šฉ์–ด๋ฅผ ์ •์˜ํ•˜๋ ค๋ฉด <dl> <dt> <dd>๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.

    ex )

    <dl>
      <dt>Milk</dt>
       <dd>Mint Choco Milk</dd>
      <dt>Cookie</dt>
       <dd>Mint Choco Cookie</dd>
    </dl>
    


  18. <iframe src="link" width="1024"></iframe> iframe ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉ ํ•˜๋Š” ๊ฒฝ์šฐ width ๊ฐ’ ์„ค์ •์„ ์ด๋Ÿฐ ์‹์œผ๋กœ ํ•œ๋‹ค.


  19. input value๋ฅผ ์„œ๋ฒ„๋กœ ๋„˜๊ธฐ๋ ค๋ฉด ?

     <form action="/action_page.php">
      Name: <input type="text" name="name">
      <input type="submit">
    </form>
    
    Name:


  20. Drop Down Box๋Š” ์–ด๋–ป๊ฒŒ ๋งŒ๋“ค๊นŒ ?

    <form action="/action_page.php">
      <select name="cars">
        <option value="Volvo">Volvo</option>
        <option value="BMW">BMW</option>
        <option value="Benz">Benz</option>
      </select>
      <input type="submit">
    </form>
    


  21. Text ์ž…๋ ฅ ์ฐฝ์— placeholder๋ฅผ ๋„์šฐ๋ ค๋ฉด ?

    <form action="/action_page.php">
      Name: <input type="text" placeholder="Input Your Name">
    </form>
    
    Name:

Leave a comment