The Web Developer 부트캠프_6

Hyuntae Jung·2022년 8월 6일
0
post-thumbnail

Section 6. CSS 기초

Contents

  • CSS란?
  • 방대한 CSS에 당황하지 않기
  • 스타일을 올바르게 담기
  • 색 및 배경색 속성
  • 색상 시스템: RGB와 알려진 색상
  • 색상 시스템: 16진법
  • 세미콜론과 CSS
  • 일반 텍스트 속성
  • 픽셀로 글꼴 크기 지정하기
  • 글꼴 집합

1. CSS

.post a:hover {
	text-decoration: underline;
    }

.post button: active {
	background-color: #02c39a;
    }
    
.post:nth-of-type(2n){
	background-color: #dfe8dc;
 	}
    
h2::first-letter {
	font-size: 50px;
    }

https://developer.mozilla.org/ko/docs/Web/CSS/:hover

2. CASCADE

: CSS는 Cascade Style Sheet의 약자이다.

h1 {
	color: red;
}

h1 {
	color: purple;
}

h1에 적용된 color가 두가지인데 CASCADE에 따라 가장 마지막에 입력된 purple이 적용된다.

3. Specificity

 p {
    color: yellow;
 }

Element Selector


 section p {
    color: teal;
 }

Element Selector + Element Selector

더욱 구체적인 CSS가 적용되어지므로 teal이 적용된다.

적용 우선순위
: ID > CLASS > ELEMENT


인라인, !important 쓰면 안되지만 알고는 있어야 한다.

4. Color

https://coolors.co/palettes/trending

0개의 댓글