coding/html

html 정리

J허브 2022. 6. 23. 14:31
반응형


<h1></h1>태그 - h1~h6까지 있으면 h1이 가장 크다.
<p></p>태그 - 문단을 넣을 때 사용
<br/> - 줄바꿈
예시)
<p>안녕하세요<br/> 반갑습니다.</p>
<strong></strong> - 글씨강조

 

  • <b> : bold 태그는 글자를 굵게 표현하는 태그.
  • <i> : italic 태그는 글자를 기울여서 표현하는 태그.
  • <u> : underline 태그는 글자의 밑줄을 표현하는 태그.
  • <s> : strike 태그는 글자의 중간선을 표현하는 태그 

빈태그

  • <br>
  • <img src="">
  • <input type="">

닫는 태그 없이 사용가능

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<input type="text"> - 텍스트 박스 생성 (닫는태그 불필요)
<input type="text" style="width: 500px; height: 100px; font-size: 90px;">
-스타일태그로 박스크기와 글씨크기 조절 가능
------------------------------------------------------------------------------
<button>버튼</button> 
<button  style="width: 250px; height: 100px; font-size: 50px;">버튼</button>
 
------------------------------------------------------------------------------
a태그 -링크를 걸어주는 태그
<a href="http://www.12341234.com" style="font-size: 30px;">홈페이지로 이동</a>
 
------------------------------------------------------------------------------
img태그 - 이미지 불러오기
<img src="http://123123123.svg" alt="이미지로드실패시 안내문구">
 
------------------------------------------------------------------------------
<ul></ul>
<ul style="font-size: 25px;">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
-세로로 1,2,3
 
<ol></ol>
 
<ol "font-size: 25px;">
<li>a</li>
<li>b</li>
<li>c</li>
</ol>
-세로로 1.a 2.b 3.c
 
------------------------------------------------------------------------------
 
table태그
caption태그 - 테이블이름
 
<table summary="테이블" style="width: 500px; height: 250px:">
<tr>
<th>이름</th>
<th>나이</th>
<th>지역</th>
</tr>
 
<tr>
<td>철수</td>
<td>12</td>
<td>서울</td>
</tr>
 
<tr>
<td>영희</td>
<td>14</td>
<td>부산</td>
</tr>
 
------------------------------------------------------------------------------
form태그 
 
<form>
<input type="text" style="font-size: 50px;"> 
<input type="email" style="font-size: 50px;">
<input type="password" style="font-size: 50px;">
<input type="date" style="font-size: 50px;">
<input type="checkbox" style="font-size: 50px;">체크박스</input><br/>
 
<select nama="coffee">
<option value="1">아메리카노</option>
<option value="2">카페라떼</option>
<option value="3">에스프레소</option>
</select>
<div>
<button type="submit" style="font-size: 50px;">완료</button>
</div>
</form>
cs
반응형