[31일차] HTML - CSS

SOSO·2022년 5월 30일
0

학원

목록 보기
31/59
post-thumbnail

CSS

CSS란 ?

CSS(Cascading Style Sheets)는 속성을 이용해 웹 디자인 요소를 제어하는 기능.
CSS를 한 곳에 설정하면 특정 HTML 태그, 단일 웹 페이지, 전체 웹 사이트에 걸쳐 문서 외양에 스타일이적용된다.

CSS의 동작 방식

방문자가 주소창에 주소를 입력하거나 링크를 클릭해 웹 페이지를 열면(웹 페이지가 저장된 컴퓨터인)서버는 HTML 파일과 연결되거나 HTML 파일에 포함된 다른 파일과 함께 HTML파일을 방문자의 컴퓨터로 전송한다. 브라우저는 HTML에 링크되어 있는 또는 삽입된 CSS코드를 해석하고 이를 HTML에 적용한다.

CSS의 장점

  • 기능 확장성 : HTML 기능의 확장 가능
  • 양식 모듈화 : 흐름이 같은 문서 양식으로 전체 구성 가능
  • 간편성 : 문서 형식을 손쉽고 다양하게 구성 가능
  • 일관성 : 사용 환경에 영향 받지 않음

CSS의 단점

  • 브라우저의 호환성 문제

CSS의 삽입방법

  • 인라인 스타일 - HTML 태그 내의 스타일 추가

    <h1 style="color:red;">인라인 스타일</h1>
  • 문서내 지정형 (Embedding Style)

    <style type=”text/css” media=”all”>
    h1 {color:red;}
    </style>
  • 외부 경로 삽입형(Link Style)

    <link rel=”stylesheet” href=”style.css” type=”text/css” media=”all” />

선택자

규칙을 식별하는 알파벳과 숫자로 된 문자

  • 전체 선택자

    *{
    margin:0;
    padding:0;
    }
  • 태그 선택자

    p{ font-size : 1em; }
  • 클래스 선택자

    .authorName{ font-size:1em;}
  • 4) ID 선택자

    #content{ position:relative;}
profile
한다 열심히

0개의 댓글