백그라운드관련 질문입니다.
큰나래
안녕하세요^^
저번에도 백그라운드관련질문을 드린적이있었는데 ㅠ또 궁금한게 생겨서 올립니다.
저번에는 하나의 div 안에 백그라운드를 2개쓸수있는지여부를 물었는데
역시 css3가 아니어서 그건안되고 그래서 div 안에 또다른div를 넣어서 각각한테 백그라운드를 주는방법으로 생각했습니다.
그런데 문제는 ㅠ백그라운드이미지가 2개가 필요한데요
한쪽은 왼쪽을 기점으로 왼쪽으로 repeat 되야하고
또한쪽은 오른쪽을 기점으로 오른쪽으로 repeat되야합니다.
저 그림을 보시면 검은색 네모부분은 그냥 html안에 쓴 이미지입니다.
그런데 그이미지가 width100프로 늘어나야되서 양옆에 이미지부분을 1px로 잘라서 각양쪽으로늘리려고 하는데요
화살표방향으로 늘어나게하고싶은데 저런 방법을 코딩으로 구현할수있나요?
repeat-x left top 을 주면 빨간색방향으로 repeat되고
repeat-x right top 을 주면 파란색방향으로 repeat되는건 아는데
그렇게되면 해당모니터를 기점으로 오른쪽에서 , 아님 왼쪽에서 반복되는거라...ㅠ
저는 저 이미지를 기점으로 모니터를 향해 반복되게하고싶은데요 ㅠ
저렇게 할수있는 방법은 없는거죠? 그냥 이미지를 통으로 width값 1800정도로 크게잘라서
repeat 시키는 방법밖에없는건가요?
설명이어려운것같네요 ㅠ이해안되시면 댓글달아주세요
-
찬솔나라
저도 이걸로 고민했는데요...저는 1000px메뉴를 가운데 정렬 기준으로 왼쪽배경, 오른쪽 배경의 색이 달라요. 이것저것 해보다가 그냥 최대 큰 해상도의 배경 통이미지를 자르고 background:url(이미지주소) no-repea 50% 0%; 이렇게 해결했네요 ^^;;;
-
스릉흔드
꼼수는 absolute, width:50%, height:100%로 양쪽배치해서 깔아버리는 방법도 있습니다... 참고만~
-
찬놀
그쵸..역시 ㅠ저도 그냥 크게자를까하다가 혹시 이방법이 있나싶어서요..ㅠ
역시 크게자르는게 젤 낫겟군요 ㅠ괜히 div만 한번 더묶었네요ㅠㅠ
감사합니다^^ -
미련곰팅이
아니면 이미지를 크게 잘라서 left center 정렬로 리핏 시키시면 되지 않을까요? 그럼 이미지도 하나만 써도 될텐데 말이죠.. 해상도 대응을 어디까지 하실건지 잘 생각해보시고 자르시는 것을 추천 하겠습니다.