Notice
Recent Posts
Recent Comments
Link
«   2024/11   »
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
Tags more
Archives
Today
Total
관리 메뉴

기초공사 (html,css,javascript)

0303 - img 본문

academy/html

0303 - img

에스프레소라떼 2024. 3. 3. 11:10

//

https://inpa.tistory.com/entry/CSS-%F0%9F%93%9A-%EC%9D%B4%EB%AF%B8%EC%A7%80-%EC%82%AC%EC%9D%B4%EC%A6%88-%EB%B9%84%EC%9C%A8-%EB%A7%9E%EC%B6%94%EB%8A%94-3%EA%B0%80%EC%A7%80-%EB%B0%A9%EB%B2%95-object-fit-background-size-position

 

🌟 이미지 사이즈 비율 맞추는 3가지 방법 (object-fit / background-size / position)

프론트를 작업할때, 컨테이너의 크기는 고정되어 있는데, 해당 컨테이너 안에 들어갈 이미지의 크기는 다양한 경우가 있다. 예를들어 이미지를 확대/축소 하거나 특정 비율로 나타나게 하기위

inpa.tistory.com

1. cover가 

html 에서는 어떻게 써야하나? object-fit라는것도 있다. 위 사이트 참고.

 

2.

발단 : 이미지가 경로는 맞는데 이미지가 안뜬다.

알고보니 저 표시된부분에 .ACADEMY WORKSPACE로 되어있었다

 

workspace는 가상의 공간이다.  이렇게 하면 잘 안열린다.

저 부분을 없애야하는것은 작업하는 폴더를 큰부분에 드래그해야 workspace로 되지않는다.

새롭게 암..

'academy > html' 카테고리의 다른 글

0303-픽픽  (0) 2024.03.03
0303-box-sizing실습  (0) 2024.03.03
0302-html구조짜면서-padding이 높이  (0) 2024.03.03
0302-html구조짜면서-padding이 높이  (0) 2024.03.02
html구조- 나누기-section과 article  (0) 2024.02.29