[HTML] 기초문법-3

 

1. 링크 걸기

앵커(Anchor) 태그 이용. 

*Anchor ===> 의미 : 닻

 

 <h2>글자에 링크 걸기</h2>
        <a href='같은 웹 페이지라면 경로.html'>글자</a>
         <a href='다른 웹 페이지라면 http로 시작하는 완전한 경로'>글자</a>

<a></a> : 링크를 거는 역할

href : 클릭시 이동할 주소

 

<h4> <a href="http://www.naver.com" target="_blank">메인으로 이동</a></h4>

target : 링크를 여는 속성값을 지정할 수 있음 . _blank는 새로운 탭이 열리면서 이동.

 

 

 

2. 테이블 만들기

 

 <!--화면의 구성요소로 테이블을 만들때 사용하는 태그-->

        <table border="1"> <!--border: 경계선 만드는 속성. 
       						 여기서 꾸밀수도 있지만 꾸미는건 CSS에서 할것! -->
            <tr>    <!-- table low: 테이블의 각 행을 생성-->
                <th>출발</th> <!--table column header: 테이블의 각 컬럼(열)을 생성 -->
                <th>도착</th>
                <th>객실</th>
                <th>요금</th>
            </tr>
               
            <tr>
                <td>서울(17:25)</td>
                <td>부산(20:07)</td>
                <td>일반실</td>
                <td>50,800원</td>
            </tr>

<table> 표에 넣고자 하는 내용

<tr> 하나의 행

<th> 테이블 각 열의 제목

<td> 열제목에 나타는 셀 제외한 열의 내용

 

 

 <table>
   <tr>
   <th rowspan="2">지역</th>   <!--여러개의 행을 세로 방향으로 병합-->
   <th colspan="2">27일(목)</th> <!--여러개의 셀을 가로 방향으로 병합-->
   <th colspan="2">28일(금)</th>
   <th colspan="2">29일(토)</th>
   </tr>

  <tr>
  <td>오전</td>
  <td>오후</td>
  <td>오전</td>
  <td>오후</td>
  <td>오전</td>
  <td>오후</td>
  </tr>

  <tr>
  <td>서울<br>경기도</td>
  <td><img src="shine.png"></td>
  <td><img src="shine.png"></td>
  <td><img src="shine.png"></td>
  <td><img src="rain.png"></td>
  <td><img src="rain.png"></td>
  <td><img src="rain.png"></td>
  </tr>

  <tr>
  <td>제주도</td>

  <td><img src="rain.png"></td>
  <td><img src="rain.png"></td>
  <td><img src="rain.png"></td>
  <td><img src="shine.png"></td>
  <td><img src="shine.png"></td>
  <td><img src="shine.png"></td>
  </tr>



</table>

 

3. 입력양식 만들기

 

  <!-- <form> 태그 하나가 하나의 입력 양식을 생성 -->
    <!-- 현재의 화면의 구성요소로 한개이상의 입력양식을 만들어야한다면
    그 입력양식의 개수만큼 <form>태그가 나와야함 -->
    <form action="">
        아 이 디 : <input type="text"><br>
        비밀번호 : <input type="password">
    </form>