테스트 사이트 - 개발 중인 베타 버전입니다

css backgroun 문의드립니다 채택완료

구비 8년 전 조회 4,914

날씨가 추워집니다. 감기 조심들 하세요~

 

http://demo.moowabo.com/g5/ksj-r/">http://demo.moowabo.com/g5/ksj-r/ 

 

현재 테마 작업중인 사이트입니다.

bootstrap 기반으로 작업중인데요..

 

배경을 풀스크린으로 지정을 하고 

<header></header>

<main></main>

<footer></footer>

식으로 작업하고 있습니다.

 

그런데 희한하게 배경을 깔고 그 위에 코딩을 하는건데도 

그안에서 header, main, footer 등에 배경색을 지정하면 적용이 안되네요.

 

한참 안으로 들어가서 div 에 배경을 지정하면 적용은 되는데요.

그렇게 되면 원하는 사이즈나 디자인대로 작업을 할 수가 없네요.

 

어떤 부분에서 css가 잘못되었거나 한 것 같은데 도저히 찾질 못하겠습니다.

z-index도 맞춰서 해보았는데 되질 않습니다.

 

현재 백그라운드는 https://css-tricks.com/perfect-full-page-background-image/">https://css-tricks.com/perfect-full-page-background-image/ 에서 배운대로

 

</p><p>#MWB-bg { position:fixed; top:-50%; left:-50%; width:200%; height:200%; }</p><p>#MWB-bg img { position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; min-width:50%; min-height:50%; }</p><p>

 

이 방법을 사용하고 있습니다.

 

고수님들의 도움 부탁드립니다.

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
8년 전

#MWB-bg{z-index:-1;}

#MWB-bg img{z-index:0;}

추가하세요.

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

구비
8년 전
답변 감사합니다.
말씀하신 대로 해보니 잘 되네요.
저는 #MWB-bg 에만 z-index:0 으로 값을 줬을 때 안되었는데
이렇게 #MWB-bg{z-index:-1;} 값만 줘도 적용이 되는군요.
혹시나 싶어서 적어주신 대로 img 값에도 미리 값을 줘야겠습니다.
카츠
8년 전
#MWB-bg 만 적용하셔도 현재로서는 되는데 작업진행하시면서 영역이 추가될가능성을 생각해 확실한 순위를 설정하시라고 #MWB-bg img{z-index:0;} 도 추가로 말씀드린 거에요.

댓글을 작성하려면 로그인이 필요합니다.

8년 전

배경 자체에 포지션 값이 있으니 메인값에도 포지션 값을 주시면 될것 같습니다. position:relative;width:100% 로 주시고 배경색을 지정 하시면 변경 될겁니다.

 

header 같은 경우에는 해당 안에 ul 에 백그라운드가 지정 되어 있으니 그부분을 제거 하시면 배경 지정이 가능 하겟네요

 


 

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

구비
8년 전
답변 감사합니다. 말씀하신 대로 해보았는데 안되네요 ^^

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인