반응형
-이미지 태그 <img>
속성 설명
scr 이미지의 경로지정(파일경로나 URL)
(=source)
alt 이미지에 대한 설명 (경로가 잘못되었을 경우)
a. 현재를 기준으로 ./
b. 상위를 기준으로 ../
c. 루트를 기준으로 ../../../
--앵커태그
<a href="url">텍스트</a>
속성 설명
href hypertext reference로 연결할 주소 지정
--테이블태그
<table>
코딩이 아니라 일반적으로 표를 만드는 상황
표를 만들때 => <table></table>
몇줄 만들건지 => table row => <tr></tr>
몇칸 만들건지 -> td를 여러번 만든다
테이블안의 내용 => table data => <td>내용</td>
-->
<table>
<tr>
<td>가나</td>
<td>다라</td>
</tr>
<tr></tr>
</table>
rowspan -> 행을 합칠때
colspan -> 컬럼을 합칠때
회원가입 폼 실습
<body>
<!-- STEP1 -->
<form action="#" method="get">
<table width="400px">
<tr bgcolor="gray" height="50px" align="left">
<th colspan="2">STEP1 : 아이디/비번 입력</th>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td align="right">아이디</td>
<td><input type="text"></td>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td align="right">비밀번호</td>
<td><input type="password"></td>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td align="right">비밀번호 확인</td>
<td><input type="password" </td>
</tr>
<!-- STEP2 -->
<tr bgcolor="gray" height="50px" align="left">
<th colspan="2">Step2 : 개인정보</th>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td align="right">성별</td>
<td>남<input type="radio" name="gender" value="man">
여<input type="radio" name="gender" value="woman"></td>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td align="right">혈액형</td>
<td><select>
<option value="A형">A형</option>
<option value="B형">B형</option>
<option value="AB형">AB형</option>
<option value="O형">O형</option>
</select></td>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td align="right">생일</td>
<td><input type="date"></td>
</tr>
</tr>
<!-- STEP3 -->
<tr bgcolor="gray" height="50px" align="left">
<th colspan="2">Step3 : 선호도</th>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td align="right">취미</td>
<td>
축구<input type="checkbox" name="hobby" value="soccer">
야구<input type="checkbox" name="hobby" value="baseball">
농구<input type="checkbox" name="hobby" value="basketball">
</td>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td align="right">좋아하는색깔</td>
<td><input type="color"></td>
</tr>
<!-- STEP4 -->
<tr bgcolor="gray" height="50px" align="left">
<th colspan="2">Step4 : 적고 싶은 말</td>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td colspan="2">
<textarea cols="56" rows="5"></textarea>
</td>
</tr>
<tr bgcolor="whitesmoke" height="35px">
<td align="center" colspan="2"><input type="submit">
<input type="reset"></td>
</tr>
</table>
</form>
</body>
반응형
'빅데이터 서비스 교육 > HTML CSS' 카테고리의 다른 글
| CSS (포지션, overflow, float, 스타일 선언) (0) | 2022.04.28 |
|---|---|
| CSS (바깥/안쪽 여백, 박스사이징, 테두리 속성) (0) | 2022.04.28 |
| CSS (font,선택자,공간분할,박스모델) (0) | 2022.04.28 |
| HTML form (0) | 2022.04.28 |
| 웹 HTML 기본 (0) | 2022.04.28 |