donaricano-btn

스타일 시트 적용방법

- 스타일 시트 적용에는 3가지 방법이 존재

1. 외부 문서에 연결(linked style)

2. 문서 내부에 정의(Embedded style)

3. 태그에 직접 정의(Inline Style)


1. 외부 문서에 연결(linked style)

- html의 <head> 태그 안에 작성한다

- 일반적으로 많이 사용

1) html


2) css

 


2. 문서 내부에 정의(Embedded style)

1) html

 

- 주석 태그태그를 인식하지 못하는 브라우저에서 스타일 시크 구문이 화면에 표시되는 것을 방지하기 위해 사용


3. 태그에 직접 정의(Inline Style)

1) html

 

블로그 이미지

리딩리드

,
donaricano-btn

<a> 태그를 이용하여 원하는 위치로 이동

- <a> 태그의 name 속성을 사용한다


1. 구현

- Cat으로 이동합니다


- Dog으로 이동합니다

 






CAT

           


블로그 이미지

리딩리드

,
donaricano-btn

테이블<table> 태그 컨트롤 하기


1. 기본 테이블 생성

numbernumbernumber
123
456

- width=50% : 화면 상 테이블 사이즈를 50%(반)으로 준다

- <table> : 테이블 생성

- <th> : 가운데 정렬되며 주로 제목을 표시

- <tr> : 한줄

- <td> : 테이블 안의 한칸 (셀)


2. 행(row) 합치기

number
1
456

- <td colspan="3"> : 옆으로 세칸을 병합한다


3. 열(column) 합치기

numbernumbernumber
123
56

- <td rowspan="2"> : 아래로 두칸 병합한다


4. 테이블안에 테이블

OceanView
pic That is awsome pic

- 테이블 안에 테이블을 만들 때 <td>와 같은 태그 안에 만들어야 한다

블로그 이미지

리딩리드

,
donaricano-btn

 문자 위의 주석 루비태그<ruby>



1. 속성

 태그

설명 

HTML4 

HTML5 

ruby 

문자 및 단어에 대한 루비 주석을 표현 

rt 

문자에 대한 설명이나 발음을 표현 

ㅇ 

rp 

<ruby>태그를 지원하지 않을 경우, 표시 형태 정의 

ㅇ 


2. 구현


- 웹 브라우에서 <ruby> 태그를 지원하지 않는 경우를 대비하여 <rp>작성


블로그 이미지

리딩리드

,