[TIL] CSS_이미지 , <div>크기

김예진·2020년 9월 16일
0

TIL

목록 보기
9/40
post-thumbnail

1. CSS로 이미지 넣기

이미지 넣는 방법은 html에서 img 태그를 사용하는 것뿐이라고 생각했지만
css로도 이미지를 넣을 수 있다는 걸 알았다!!

html에서 세션을 나누어주는 div 태그를 사용해서 클래스를 만들어주고,

<div class="bg-img">배경이미지</div>

css에서 background-image 속성을 추가해서 속성값에 url("이미지 주소")를 작성하면 된다.

.bg-img {
  background-image: url("이미지 주소 삽입");
}

2. div 태그의 가로와 세로 크기

div 태그는 block 요소다. (뒤에서 한번 inline과 block에 대해 더 쓰겠지만!)

div 태그의 세로크기 : 내부에 있는 콘텐츠나 요소의 크기에 의해서 결정

div 태그의 가로크기 : 화면의 가로 크기만큼 차지

profile
Backend Developer 🌱 벨로그 내용을 티스토리로 이사중~!

0개의 댓글