[패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 8회차 미션
스크립트
<script>
- 스크립트 코드를 문서에 포함하거나 외부 스크립트를 참조
</body>
위에 적어야 함- 속성
async
: 스크립트의 비동기적(Asynchronously) 실행 여부 (Boolean,src
속성 필수)defer
: 문서 파싱 (구문 분석) 후 작동 여부 (Boolean,src
속성 필수)src
: 참조할 외부 스크립트 URL (포함된 스크립트는 무시)type
: MINE 타입 (text/javascript
, 기본값)
- display : none
<noscript>
- 스크립트를 지원하지 않는 경우에 삽입할 HTML 을 정의
<noscript>
<p>자바스크립트를 지원하지 않는 환경입니다.</p>
</noscript>
- inline 속성
표 콘텐츠
<table>
, <tr>
, <th>
, <td>
<table>
: 데이터 표, table 속성 (block 요소와 비슷)<tr>
: 행 (줄), table-row 속성<th>
,<td>
: 열(칸) , table-cell 속성 (제목/데이터)
<!-- 행2, 열2 테이블 -->
<table>
<tr> <!-- 행 -->
<th>...</th> <!-- 열 -->
</tr>
<tr>
<td>...</td>
</tr>
</table>
<th>
- 표의 헤더
- 속성
abbr
: 열에 대한 간단한 설명headers
: 자신이 종속되어 있는 상위 개념의 열에 연결을 할때 쓰는 속성 (id 값과 연결)colspan
: 병합하려는 열의 수 (number) (수평 병합)rowspan
: 병합하려는 행의 수 (number) (수직 병합)scope
: 자신이 누구의 '헤더' 인지 명시"col"
: 자신의 열 (헤더가 위에 있음)"colgroup"
: 모든 열- "
row
" : 자신의 행 (헤더가 왼쪽에 있음) "rowgroup"
: 모든 행"auto"
: 기본값
<td>
- '일반 칸' 을 지정
- 속성
headers
: 자신이 종속되어 있는 상위 개념의 열에 연결을 할때 쓰는 속성 (id 값과 연결) (<th>
와 연결)colspan
: 병합하려는 열의 수 (number) (수평 병합)rowspan
: 병합하려는 행의 수 (number) (수직 병합)
<caption>
- 표의 제목을 설정
<table>
당 하나의<caption>
만 사용 가능
<table>
<caption>표 제목</caption>
<tr>
...
</tr>
</table>
<colgroup>
, <col>
- 표의 열들을 공통적으로 정의하는 칼럼(
<col>
) 과 그의 집합 (<colgroup>
) <caption>
밑에 정의- 빈 태그
- 속성
span
: 연속되는 열 수 (number)
<table>
<caption>제목</caption>
<colgroup>
<col style="background-color: red;">
<col>
</colgroup>
<tr>
<td>...</td> <!-- red -->
</tr>
<tr>
<td>...</td> <!-- no color -->
</tr>
</table>
<table>
<caption>제목</caption>
<colgroup>
<col style="background-color: red;" span="2">
</colgroup>
<tr>
<td>...</td> <!-- red -->
</tr>
<tr>
<td>...</td> <!-- red -->
</tr>
</table>
<thead>
, <tbody>
, <tfoot>
- 순서대로 표의 머리글, 본문, 바닥글을 지정
- 레이아웃에 영향 X , 의미가 있음
<table>
<thead>
<tr>...</tr>
</thead>
<tbody>
<tr>...</tr>
</tbody>
</table>
프론트엔드 올인원 패키지 바로가기 -> https://bit.ly/3m0t8GM
Author And Source
이 문제에 관하여([패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 8회차 미션), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@ji-yeong/패스트캠퍼스-수강-후기-프론트엔드-인강-100-환급-챌린지-8회차-미션저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)