본문 바로가기
프로그래밍/HTML_CSS

자주 쓰이는 CSS

by 조크리 2020. 9. 23.
반응형

1. 배경 관련

background-color

background-image

background-size

background-position

border-raius

 

2. 사이즈

width

height

 

 

3. 폰트

font-size

font-weight

font-family

color

 

4. 간격

margin

padding

 

- margin은 요소 외부 여백(요소와 화면과의 여백)을, padding은 요소 내부의 여백을 의미한다. 

CSS Box Model - margin과 padding 완벽 이해

이 링크를 참고하여 margin과 padding을 살펴보면된다!

 

 

 

 

CSS 연습하기

 

1) 선택자(selector) 연습

flukeout.github.io/

 

CSS Diner

A fun game to help you learn and practice CSS selectors.

flukeout.github.io

2) CSS 속성 값 수정

codepen.io/Lubna/pen/dyoqzwP

 

Hello Spring - CSS colouring page

...

codepen.io

lubna.dev/articles/colouring-with-code/

 

Colouring with code

Have fun colouring in these spring illustrations with CSS.

lubna.dev

3) CSS 속성 flexbox 

flexboxfroggy.com/#ko

 

Flexbox Froggy

A game for learning CSS flexbox

flexboxfroggy.com

 

반응형

'프로그래밍 > HTML_CSS' 카테고리의 다른 글

HTML과 CSS파일 분리하기  (0) 2020.10.06
HTML class와 id 비교  (0) 2020.09.23
HTML 부모-자식 구조 , CSS 선택자  (0) 2020.09.23
HTML 자주 쓰는 태그(Tag) 정리하기  (0) 2020.09.22
CSS 적용 순서  (0) 2020.07.16