css background 질문드립니다! 도와주세요..
답변 4개 / 댓글 4개
janedoe
2018-03-17 (토) 22:34:05
1. page-header height 값에 378px이 아니라 포토샵에서 합성한 그림에 나온 배경 height 값을 주세요(원하시는 그림의 배경 높이값이요) 그리고 background-size 값을 cover으로 지정해보세요 . 이렇게 하셔서 좌우가 잘리거나 하면 비율에 맞게 배경이미지를 조정하세요 . 그리고 메뉴마다 다른 배경을 원하시면 page-header1 ~ page-header4 까지 클래스를 다르게 지정하시고 각 클래스 마다 배경이미지 이름을 다르게 주세요. 그리고 해당페이지 header 에 클래스명을 지정하시면 됩니다
답변에 대한 댓글 2개
janedoe
2018-03-18 (일) 02:32:32
뭉개진다는 것이 어떤 의미인지는 모르겠는데 모바일 부분은 미디어 쿼리를 사용해서 적절히 조정하셔야 합니다... (아마 모바일 부분은 height 를 다른 값으로 지정하셔야 할 것이고요..) 단 몇줄의 css 추가로 모든 것이 해결될 수는 없어요.... 사용하신 css 를 보니 누군가가 만들어 놓은것을 가져다 수정하시려는 모양인데 이미 만들어진 것을 수정하는 것이 때로는 새로 만드는 것보다 어려울 때가 있습니다. 인내심을 가지고 하셔야 할 것같아요 . 모바일 부분에 질문이 있으시면 파일을 캡쳐하셔서 다시 질문하시는 것이 좋고요.
크리티컬팀그럼 사이즈값에 contain을 넣어주시면 될것 같네요^^
아마도 이미지가 많이 큰듯 합니다.
background-size:contain;은 엘리먼트의 크기에 맞추어 최대한 배경이미지를 꽉채워줍니다^^
답변에 대한 댓글 1개
독고진22
2018-03-17 (토) 21:25:11
흑흑..... 말씀해주신 background-size:contain; 를 추가하였으나 출력 결과물이 이전과 동일합니다 ㅠㅠ 죄송합니다.. 혹시 몰라서 background-size:cover; 도 설정해봤으나 같은 출력입니다 ㅠㅠ
독고진22
2018-03-17 (토) 21:17:52
엔바이츠님 바쁜시간에도 시간내주셔서 감사합니다.
말씀하신대로 적용해보니
이미지 중간부분만 확대되어서 나타나고있습니다...ㅜㅜ
크리티컬팀selection.page-header클래스에 height값을 이미지 높이만큼 줘보세요^^
답변에 대한 댓글 1개
답변을 작성하려면 로그인이 필요합니다.