테이블 스티키(sticky) 기능이 있는 블로그 형식으로 글을 작성해보겠습니다. 테이블 스티키 기능은 페이지를 스크롤 할 때, 일정 영역의 컨텐츠를 항상 화면 상단에 고정하여 보여주는 기능입니다. 이를 활용하면, 특정 정보나 메뉴를 사용자가 쉽게 찾을 수 있도록 할 수 있습니다.

.tableFixHead {
	overflow-y: auto;
	height: 500px; 
      }
.tableFixHead thead th {
	position: sticky;
    top: 0px; 
}


<div class="tableFixHead">
	<table>
    	<thead>
			<tr >
				<th >title1</th>
             </tr>
        </thead>
        <tbody>
        	<tr>
            	<td>1</td>
            </tr>
            <tr>
            	<td>1</td>
            </tr>
            <tr>
            	<td>1</td>
            </tr>
            <tr>
            	<td>1</td>
            </tr>
            <tr>
            	<td>1</td>
            </tr>
            <tr>
            	<td>1</td>
            </tr>
            <tr>
            	<td>1</td>
            </tr>
            
        </tbody>
        
    </table>

</div>


부모 객체 중에 overflow: hidden 선언 되어있으면 작동 안함.