컴퓨터공학/인터넷활용

인터넷활용 7 - 1 CSS3 스타일 시트 개요

Arkeiyou 2021. 10. 7. 14:11

용어체크

1. CSS

  • Html 언어로 작성된 문서 내용을 기준으로 다양한 서식을 제작할 수 있는 언어

2. CSS 삽입

  • 내부 스타일,외부 스타일, 인라인 스타일 3가지가 있음

3. CSS 선택자

  • 서식을 변경할 대상

 

학습내용
  • 1. CSS3 스타일 시트 개요
  • 2. CSS3 스타일 시트 삽입방법
  • 3. 전체, 태그 선택자
    • CSS3 스파일 시트 삽입방법 3가지
    • 태그 선택자를 이용한 CSS3 사용법
학습목표
  • 1. CSS3 스타일 시트의 구성에 대해서 설명할 수 있다.
  • 2. CSS3 스타일 시트 삽입방법에 대해서 설명 할 수 있다.
  • 3. 태그 선택자에 대해서 설명할 수 있다.

 

 

1. CSS3 스타일 시트 개요

 

1) 스타일시트란?

 

웹 문서의 출력될 외형 스타일

HTML태그로는 세세한 부분까지 모두 다 지정하기에는 부족하다. 스타일시트를 이용하면 크기, 색상 등의 스타일을 일괄 적용 : 글자간격, 문단간격, 위치 등 세세한 제어

 

 

 

 

 

 

Quiz 01멀티미디어 특성으로 단반향성을 들 수 있다.

  • 1 O
  • 2 X

정답 :2

해설 :멀티미디어는 양방향성, 상호작용, 디지털화 등을 특성으로 들 수 있다.

Quiz 02웹에서 사용할 수 있는 이미지 확장자가 아닌 것은?

  • 1 jpg
  • 2 psd
  • 3 gif
  • 4 png

정답 :2

해설 :psd파일은 포토샵 저장 파일로 웹 확장자로 사용할 수 없다.

Quiz 03다음 중 <img>태그 속성 중 웹페이지 화면에 이미지를 로드시키지 못할 경우 그 위치에 지정한 텍스트가 이미지 대신 출력하는 속성은?

  • 1 src
  • 2 width
  • 3 height
  • 4 alt

정답 :4

해설 :alt 속성에 대한 설명이다.

 

학습정리

1. CSS3 스타일 시트

  • 스타일시트(CSS)는 웹 문서의 출력될 외형 스타일을 좀더 다양하면서 손쉽게 적용하기 위한 기능으로 콘텐츠의 내용과 디자인을 분리해서 사용하기 위한 기능을 가짐
  • CSS는 사용은 <head> 태그 안에 <style> 로 적용하며 선택자와 속성으로 구성되어 있음