μ΄ μ± μ ν λλ‘ κ°μλ₯Ό λ€μμ΅λλ€.
Do it! HTML+CSS+μλ°μ€ν¬λ¦½νΈ μΉ νμ€μ μ μ
μΉμ κΈ°λ³Έμ ν κΆμΌλ‘ λλΌ μ μλ μ±
μ΄ νμνλ€! 8λ
μ°μ μΉ λΆμΌ λμ 1μμΈ γDo it! HTML5+CSS3 μΉ νμ€μ μ μγμ κ³ κ²½ν¬ μ μλ ‘HTML, CSS, μλ°μ€ν¬λ¦½νΈλ₯Ό ν κΆμΌλ‘’ λ°°μ°κ³ μΆλ€λ λ§μ λ
μμ μꡬλ₯Ό λͺ¨μ μ΅μ κ²½ν₯μ λ°μν μ΄ μ±
μ μ§ννλ€. μΉ κ°λ°μ μμνλ μ
λ¬Έμλ μ½κ² μ€μ΅ν μ μκ³ , μ€μν λ¬Έλ²λ§ λ€μ 곡λΆνκ³ μΆμ μ€γκ³ κΈμμκ²λ λμμ΄ λλ€. μΉμ ν μ€λͺ
μ κΈ°λ³Έ! ν΅μ¬λ§ μμ λ½μμ μ€λ¬΄μ λ°λ‘ μ¬μ©ν μ μλ μμ λ νμ±νκ² λ΄κ²¨ μλ€. λν μ΅μ μΉ νμ€ κΈ°μ μΈ HTML5, CSS3, μλ°μ€ν¬λ¦½νΈ(ES6)λ₯Ό κΈ°μ€μΌλ‘ μ€λͺ
νλ©° μ±
μ λͺ¨λ λ΄μ©μ μμΆν μ΅μ’
νλ‘μ νΈ γμΉ μ¬μ΄νΈ λ§λ€κΈ°γ PDF μ μμ±
μ 무λ£λ‘ μΆκ° μ 곡νλ€. μλ§μ λ
μκ° μ
μ λͺ¨μ ‘μΉ λΆμΌμ κ΅κ³Όμ’λΌκ³ λΆλ₯΄λ μ΄μ λ₯Ό μ§κΈ νμΈν΄ 보μ!
- μ μ
- κ³ κ²½ν¬
- μΆν
- μ΄μ§μ€νΌλΈλ¦¬μ±
- μΆνμΌ
- 2021.01.22

λͺ¨λΈ - λ·° - 컨νΈλ‘€λ¬(MVC)
MVC1 λͺ¨λΈ

MVC2 λͺ¨λΈ - κΆμ₯

HTMLμ΄λ
Hyper
Text
-> μΉμμ μμ λ‘κ² μ€κ° μ μλ λ§ν¬
Mark Up
-> ν μ€νΈ λΏλ§ μλλΌ μμ, μ΄λ―Έμ§ λ±μ νμ
Language
==> μΉμμ μμ λ‘κ² μ€κ° μ μλ μΉ λ¬Έμλ₯Ό λ§λλ μΈμ΄
- μ맨ν±(semantic) : μλ―Έλ‘ μ μΈ, μλ―Έκ° ν΅νλ
μ΄λ¦λ§ λ΄λ μ μ μλ HTMLνκ·Έ
<div> <title> <head> <body> </div>
λ€μν λ΄μ© μ λ ₯νκΈ°
<hn>νκ·Έ
- μ λͺ©μ νμν λ μ¬μ©νλ νκ·Έ
- h1 > h2 > h3 > … > h6
<p>νκ·Έ
- Pνκ·Έλ blockμμμ΄λ€. (νμ€μ μ°¨μ§νλ€), κΈ°λ³Έλ§μ§ μ‘΄μ¬(16)

<br>μ€ λ°κΏ νκ·Έ
- λ«λ </br> μμ
<blockquote> λ€μ¬μ°κΈ° νκ·Έ
<strong>,<b> κ΅΅κ² νμ
- <strong>κ°μ‘°νμ</strong> — μλ―Έμλ strong μ°κΈ° μΆμ²
- <b>λ΄μ© κ΅΅κ²</b>
<em><i> μ΄ν€λ¦μ²΄ νμ
<ol> - <li> λͺ©λ‘ ν
<body>
<h1>λͺ©λ‘ 보μ¬μ£ΌκΈ°</h1>
<ol>
<li>HTML5</li>
<li>CSS3</li>
<li>JAVASCRIPT</li>
<li>JQuery</li>
</ol>
<ul>
<li>HTML5</li>
<li>CSS3</li>
<li>JAVASCRIPT</li>
<li>JQuery</li>
</ul>
</body>

<dl>, <dt>, <dd> μ€λͺ λͺ©λ‘
<dl>
<dt>FrontEnd</dt>
<dd>HTML5</dd>
<dd>CSS3</dd>
<dd>JavaSCRIPT</dd>
<dd>JQuery</dd>
<dd>ReactJS</dd>
<dt>BackEnd</dt>
<dd>Java</dd>
<dd>DB</dd>
<dd>JspServelet</dd>
<dd>SpringFrameWork</dd>
<dd>SpringBoot</dd>
</dl>

<table>, <tr>, <th>, <td> —ν μ΄λΈ λ§λ€
<table border="1">
<caption>HTMLνμ΅</caption>
<tr>
<th>A</th><th>B</th><th>C</th><th>D</th>
</tr>
<tr>
<td>HTML5</td>
<td>CSS3</td>
<td>JavaSCRIPT</td>
<td>JQuery</td>
</tr>
</table>

<style> λ£κΈ°
<style>
/*HTML λ¬Έμ λ΄μμ λμμΈ(internal stylesheet)*/
table, tr, td{border-collapse: collapse;}
</style>

row, col ν©μΉκΈ° (rowspan, colspan)
<table border="1">
<caption>HTMLνμ΅</caption>
<tr>
<thead>
<th>A</th><th>B</th><th>C</th><th>D</th>
</thead>
</tr>
<tbody>
<tr>
<td rowspan="2">HTML5</td>
<td>CSS3</td>
<td>JavaSCRIPT</td>
<td rowspan="3">JQuery</td>
</tr>
<tr>
<td colspan="2">CSS3</td>
</tr>
<tr>
<td>HTML5</td>
<td>CSS3</td>
<td>JavaSCRIPT</td>
</tr>
</tbody>
</table>

μ€μ΅
<body>
<table border="1">
<caption>μμλλΌ κ°μ€</caption>
<thead>
<tr>
<th>λ°©μ΄λ¦</th>
<th>λμ</th>
<th>ν¬κΈ°</th>
<th>κ°κ²©</th>
</tr>
</thead>
<tbody>
<tr>
<td>μ μ±λ°©</td>
<td>μ¬μ± λλ―Έν 리</td>
<td rowspan="3">4μΈμ€</td>
<td rowspan="4">1μΈ 20,000μ</td>
</tr>
<tr>
<td rowspan="2">λλ°±λ°©</td>
<td>λμ± λλ―Έν 리</td>
</tr>
<tr>
<td>κ°μ‘± 1ν</td>
</tr>
<tr>
<td>μ²νν₯λ°©</td>
<td>-</td>
<td>2μΈμ€</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">λ°κΉ₯μ± μ 체λ₯Ό λ νΈν©λλ€.</td>
</tr>
</tfoot>
</table>
</body>

λ°μν
'πFront > HTML' μΉ΄ν κ³ λ¦¬μ λ€λ₯Έ κΈ
| HTML_Day02 (0) | 2024.04.20 |
|---|