상세 컨텐츠

본문 제목

background-image , background position

초보코딩

by wangmandoo1 2024. 7. 20. 12:03

본문

 

배경이미지 넣는 법 ('url') 사용

background-image: url('wangmandoo.png');

 

background-repeat: repeat;  반복하기 
background-repeat: no-repeat; 반복 안 함 

 

백 그라운드 포지션 

background-position: top; 위
background-position: right; 우
background-position: bottom; 하
background-position: left; 좌
background-position: left top; 좌상
background-position: center;중, 가운데 

 

background-size 

 

background-size: cover; 풀사이즈 ,
background-size: contain; / 최대한크게 
background-size: 40px 30px; 가로 40 , 세로 30 

 

그라디언트 ,

 background-image: linear-gradient(#000000, #ffffff);

background-image:
  linear-gradient(90deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.2));

각도 추가 하면 그라디언트 각도 변경 됨 

 

 

box shadow 

박스 그림자 

그린 정도 

box-shadow : 10px 10px 5px 8px rgba(0,0,0,0.8);

 

 

opacity 불투명도 

0에서 1 사이 소수값으로 쓰면 됨 

0에 가까울 수록 투명 

1에 가까울 수록 불투명 

opacity:0;

opacity:0.9

'초보코딩' 카테고리의 다른 글

개별 과제 진행중  (0) 2024.07.23
변수 ,정수 실수 지수형 nan infinity  (0) 2024.07.21
css 파일 만드는 법  (0) 2024.07.20
class , id  (0) 2024.07.20
웹이란  (0) 2024.07.19

관련글 더보기