[CSS] 기본 속성

 

1) CSS 속성

1.1 색

- 이름(red,green)

- RGB(255,0,0)

- 16진수(#ff0000)

 

관련사이트

https://colorhunt.co/

https://www.design-seeds.com/

1.2 배경(background-color)

 

1.3 backgroung-repeat

- 기본설정은 repeat

- repeat-x 수평반복

- repeat-y 수직반복

- no-repeat 반복안함

 

1.4 background-position

- 클래스지정 후에 backgroung-position을 통해 이동

- (x축,y축)

 

1.5 background-attachment

배경 이미지를 스크롤에 따라 움직이는지 아닌지 설정

*스크롤 입장에서 생각할 것

fixed : 스크롤 움직일때마다 같이 움직임느 화면이 움직여도 계속 보임

scroll : 어느 위치에 고정되어 스크롤을 내리면 보이지 않음

 

1.6 배경 단축(Short-Hand)

 

background: color || image || repeat || attachment || position (순서 상관 없음)

? 백그라운드 이미지 크기나 다른 설정값도 포함 가능??

 

1.7 사이즈

cover : 가로세로 중에 큰 값에 맞춰서 비율 조정

contain : 다 보이게

 

1.8 gradient - 각도

그라데이션 만들기

 #direction{

      background-image: linear-gradient(

        to top right,

       #F09433 0%,

       #E6683C 25%,

        #DC2743 50%,

        #CC2366 75%,

         #BC1888 100%);

    }

 

방향에 따른 그라데이션 만들기

각도에 따른 그라데이션 만들기

 

1.9 text

-text-align : justify(중간)

 

1.10 링크

가상선택자(:)를 이용해서 사용해줌

link : body에서 사용하지 않음

visited

hover

active

focus

 

1.11 리스트 스타일 타입

list-style-type : 블릿 수정 가능 (앞에 동그라미)

list-style-image : 블릿을 이미지로 수정가능

list-style-position : inside/outside

1.12 테이블

border 

border-collapse : 테두리 한줄?

vertical-align : 셀 안에 값 위치선정