CSS 소개, 선택자와 선언

jsleeg98·2020년 5월 17일
0

CSS

목록 보기
1/12

CSS 소개

CSS는 HTML기반으로 만들어진 언어이다. 초기에는 HTML에서 디자인을 맡기도 했지만 HTML의 본질은 정보라는 점에서 CSS로 새로운 언어가 생겨서 디자인이 분리되었다.

CSS와 HTML이 만나는 법

1.  <h1 style ="color : blue"> hello </h1> 

2.	<head>
		<style>
        	h2{
            	color:blue;
            }
        </style>
	</head>
    	<body>
   		<h2> hello </h2>
	</body>

선택자와 선언자

<style>
	h2{
       color:blue;
          }
</style>
  • h2는 선택자

  • { }안의 값은 선언자

    선택자의 종류

  • **태그 선택자

    • 태그 전체를 선택**
  • **id 선택자( # )

    • 아이디 하나를 선택**
  • **class 선택자( . )

    - 여러개의 클래스를 선택**

    => id와 class 선택자는 여러개의 id를 선택하는 것이 class를 선택하는 것과 의미는 같지만 id는 고유의 하나밖에 없다는 의미가 있기 때문에 여러개는 class로 사용하는 약속이다.

    부모 자식 선택자

  • a b : 띄어쓰기로 구분

    • a 하위에 있는 b를 선택한다.
  • a>b : >로 구분

    • a 직계 b를 선택한다.
  • a,b : ,로 구분

    • a와 b를 동등하게 선택한다.

선택자 공부

  • flukeout.github.io : 선택자 다루기 게임
  • CSS Cheat Sheet : 선택자 정리해놓은 문서, 구글 검색

0개의 댓글