예제 1-1) HTML에서 CSS제거해 보기본 예제에서는 HTML과 CSS의 관계를 이해하고 css를 사용하는 이유를 알아보기 위해 웹 페이지의 소스코드 저장하여 html로만 이루어진 사이트와 css가 적용된 사이트를 비교하여봅니다. Show
step-1> 웹브라우저 실행하여 url 입력하기
step-2> 소스 코드 다운받기
step-3> 파일 열기
step-4> 결과 확인
예제 1-2) css 작성과 실행하기CSS 기본 작성법과 HTML문서에서의 위치와 동작원리등을 살펴보기위한 예제 입니다. 코드 설명
예제 1-3) css 포함 방법 3가지
코드 설명
2장. 셀렉터와 스타일 속성예제 2-1) 기본 셀렉터본 예제에서는 태그, 클래스, 아이디의 세가지 기본 셀렉터에 대해 실습 합니다. 코드 설명
예제 2-2) 기본 셀렉터 조합셀렉터를 조합해 좀 더 정밀하게 특정 요소를 선택할 수 있습니다. 코드 설명
예제 2-3) 컬러 속성컬러를 표현하기 위해 색상이름, HEX(#)코드, RGB코드로 나타내는 방식을 실습을 통해 알아 봅니다. 코드 설명
예제 2-4) 텍스트 및 폰트 속성폰트, 글자크기, 글자 두께, 글자 모양, 글자 정렬등의 텍스트 및 폰트관련 속성 실습 예제 입니다. 코드 설명
예제 2-5) 텍스트 정렬 속성텍스트를 정렬하는 text-align 속성과 vertical-align 속성을 이용해 이미지와 텍스트를 정렬하는 예제 이니다. 코드 설명
예제 2-6) 링크 속성다양한 css속성을 사용한 하이퍼링크 실습 예제 입니다.
|