프론트엔드/HTML CSS

인턴 교육 시작 + <fieldset> , <table> 태그 정리

Se Yeon 2022. 8. 30. 12:06

오늘부터 본격적인 교육이 시작된다
틈틈히 기록해야지 !

 

<fieldset > 요소 

  : 웹 양식의 여러 컨트롤과 레이블(<label>)을 묶을 때 사용함.

<legend>요소로 그룹의 설명을 제공할 수 있음

 

*특성

 

disabled : 지정한 경우, 모든 자손 컨트롤 비활성화되므로 편집 불가능 

단, <legend> 안의 양식 요소는 비활성 상태로 전환되지 않음

form : <fieldset>요소와 연결할 <form> 요소의 id

name : 그룹과 연관지을 이름 

 

<fieldset disabled>
	<legend>Disabled fieldst</legend>
    <div>
    	<label for="name">Name: </label>
        <input type="name" id="text" value="Chris">
     </div>
 </fieldset>

비활성화 된 <fieldset>을 볼 수 있따

순서가 있는 목록을 만들때는 ol

의미없는 목록을 만들때는 ul

항목은 li 

<table>태그 


<table> : 테이블을 만드는 태그
<th> : 테이블의 헤더부분을 만드는 태그

<tr> 테이블의 행을 만드는 태그

<td> 테이블의 열을 만드는 태그 

* <td>와 <tr>의 개수는 동일한 것이 좋고 값을 비워야한다면 <td>로 열을 생성 후 , 값을 넣지 않으면 된다.

<table border="1">
	<th>성별</th>
	<th>나이</th>
	<tr><!-- 첫번째 줄 -->
	    <td>남자</td>
	    <td>25</td>
	</tr><!-- 첫번째 줄 끝 -->
    
	<tr><!-- 두번째 줄 -->
	    <td>여자</td>
	    <td>24</td>
	</tr><!-- 두번째 줄 끝 -->
    </table>