linear-gradient(180deg, 시작색상, 종료색상); - deg는 생략이 가능 -> 그라데이션 효과를 줌
deg는 각도를 뜻하는 degree이다. 기본적으로 180도(위에서 아래로) 내려오게끔 설정 되어 있다.
rgba(red,green,blue,alpha); - 색상 rgb와 투명도 조절 alpha -> 0~1 0에 가까울수록 투명
opacity와 같은 기능. opacity 역시 0~1까지. -> 근데 얘는 요소 전체를 흐리게함. 포함되있는 모든게 흐려짐
- alpha의 경우 본인만 흐려진다.
box-shadow : 0px, 0px, 0px, 0px, rgb(a) -> 박스의 그림자 가로,세로, 흐린정도, 퍼지는정도, 색상.
overflow - 박스의 크기보다 콘텐츠의 양이 많아 박스 바깥으로 나오는 현상.
그래서 css 로 overflow: hidden; 을 해주면 넘치는 내용이 가려진다.
overflow : scroll;은 스크롤을 내리면 보이게해준다.
-가로로 스크롤하게 만들수도 있는데, white-space : nowrap;을 하면 가로로 스크롤이 가능하다.
(하지만 전체 화면의 스크롤이 되버림. 해당 부분만 스크롤 하게 바뀌지 않음)
- white-space : nowrap;은 줄바꿈을 안하겠다 라는 선언으로, 보통의 css는 화면이 넘치지 않게 줄바꿈을 지원하는데, 해당 코드를 사용하면 줄바꿈을 안하게 만들어서 화면 밖으로 나가면서 스크롤이 생긴다.
->> 그래서 overflow:scroll과 white-space : nowrap;을 같이 쓰면 해당 overflow된 부분에만 스크롤이 생김.
margin 상쇄 : margin은 세로 margin끼리 만났을 때, 더 큰 margin값을 적용한 후 작은 값의 margin은 적용되지 않는다.
(작은 값의 margin은 없어도 됨.) * 하지만 사이에 border값이나 padding값으로 거리가 있다면 상쇄되지 않음.