8/8 html(ctrl + shift + s)

http://javadeveloper.tistory.com/2

<!-- tr은 세로갯수(열) td는 가로갯수(행)이다. -->
    <table border = "1"><!-- 선굵기(안하면 외곽선이 안나옴) -->
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
        </tr>
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
    </table>

<!-- tr은 세로갯수(열) td는 가로갯수(행)이다. -->
    <table border = "1"><!-- 선굵기(안하면 외곽선이 안나옴) -->
        <tr>
            <td>이름</td>
            <td>나이</td>
            <td>연봉</td>
            <td>고향</td>
        </tr>
        <tr>
            <td>정우현</td>
            <td>25</td>
            <td>3000</td>
            <td>부산</td>
        </tr>
        <tr>
            <td>우현이</td>
            <td>27</td>
            <td>3500</td>
            <td>서울</td>
        </tr>
    </table>

<th></th>맨위에줄 이름, 나이 등은 th로 하면 진하게 표현됨

<td colspan="2">1</td>    행으로 셀병합 병합할것을 빠질것은 주석을잡고 해야한다

<td rowspan="2">1</td>   열으로 셀병합    

<caption></caption> 테이블 제목 설정

<!-- tr은 세로갯수(열) td는 가로갯수(행)이다. -->
    <table border = "1"><!-- 선굵기(안하면 외곽선이 안나옴) -->
    <caption>111111111111111</caption>
        <tr>
            <td colspan = "2" rowspan = "2">1</td>
            <!-- <td>2</td> -->
            <td>3</td>
            <td>4</td>            
        </tr>
        <tr>
            <!-- <td>5</td>
            <td>6</td> -->
            <td>7</td>
            <td>8</td>            
        </tr>
        <tr>
            <td rowspan = "3">9</td>
            <!-- <td>10</td>
            <td>11</td> -->
            <td>12</td>            
        </tr>
    </table>

td사이에도 다른 태그를 넣을 수 있다. <ul> <li>등

뼈대만들때 사용하는것이 div이다.

<div style = "border: 3px solid red">
         <h2>사자</h2>
         <p>
             사자는 아프리카에 살며
             강한 다리와 턱,<span style = "color : red;">긴 송곳니</span>를
             지니고 있다.
         </p>
     </div>

<div style = "height:20px; background-color:yellow"></div>
    <div style = "height:50px; background-color:blue"></div>
    <div style = "height:100px; background-color:red"></div>

<!-- 내가 쓴 데이터를 서울 서버로 날린다. -->

<!-- input 으로 접속 -->

<!-- 파일이 존재하지 않을때  -->

인풋 넣어주면 그 페이지로 접속

<form></form> 제일 중요

<form action = "input.jsp" input.jsp 주세요>

<input type="text" 입력 타입은 글자입니다>

<input type = "submit" submit를 입력하면 전송버튼이 나타남 value = "호랑이" 먼저 들어가있는 초기값>

</form>

//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    <form action = "input.jsp" >
        <input type="text" value = "호랑이">
        <input type = "submit" >
    </form>

div

<div style = "border: 3px solid red">
    <form action = "input.jsp" >
        <input type = "text" value = "호랑이" ><br/>
        <input type = "text" value = "코끼리"><br/>
        <input type = "text" value = "앵무새"><br/>
        <input type = "submit" value = "확인">
        <input type = "submit" value = "전송">    
    </form>
</div>

input

<form action = "input.jsp" >
이메일 :           <input type="email"><br/>
URL :        <input type="url"><br/>
전화번호 :         <input type="tel"><br/>
색상 :        <input type="color"><br/>
월 :           <input type="month"><br/>
날짜 :        <input type="date"><br/>
주 :            <input type="month"><br/>
시간 :        <input type="time"><br/>
 
지역 시간 :    <input type="datetime-local"><br/>
숫자 :        <input type="number"><br/>
범위 :        <input type="range"><br/>
    </form>

radio

    <form>
        <input type = "radio" name = "apple">남성<br/>
        <input type = "radio" name = "apple">여성<br/>
        <input type = "radio" name = "apple" checked="checked">중성<br/><br/><!-- ch ctrl space -->
        <input type = "radio" name = "banana">소나무<br/>
        <input type = "radio" name = "banana">대나무<br/>
        <input type = "radio" name = "banana" checked="checked">중나무<br/>
        <input type = "checkbox">수신동의<br/>
    </form>    

select

    <form action = "">
    <select>
        <option>호랑이</option>
        <option selected="selected">코끼리</option>
        <option>야옹이</option>
        <option>멍멍이</option>
    </select>
    </form>

fieldset legend

<form>
        <fieldset>
            <legend>인적사항</legend>
                이름 : <input type = "text"><br>
                전화번호 : <input type = "text"><br>
                주소 : <input type = "text">
        </fieldset>
    </form>