오늘의 숙제 입니다

스피아민트

프로필 보기 이 회원 글보기 이 회원의 댓글보기

2020-03-31 (화) 22:37:20 1,832

그림 첨부 합니다

그림에서 보는 바와 같이 저런 작업은 첨이라 ....

바탕배경들갈려고 하네요

일단 아웃로긴 들간부분 삭제 했구요 저부분 합치게 하고 싶네요

어덯게 하면 될가요 ? 3542392574_1585661892.8963.jpg

메인화면

답변 4개

채택된 답변

+20 포인트

별지기천사

프로필 보기 이 회원 글보기 이 회원의 댓글보기

2020-04-05 (일) 13:48:57

http://cleanapp.cafe24.com/theme/basic/css/default.css 88째줄

Copy

#wrapper {
    z-index: 5;
    margin: 0 auto;
    width: 970px;
    /* border-right: 1px solid #dde4e9; */
    /* border-left: 1px solid #dde4e9; */
    zoom: 1;
}

기존 css 내용을 위의 내용처럼 주석처리하면 선은 사라질것입니다

그리고 가운데 정렬은......
이미지가 body 배경 이미지로 들어가 있더군요

기존 body css를

(아마도 메인쪽이나 헤더쪽)

Copy

<div id="wrapper">
    <div id="container">

<style type="text/css">

body{ background-image:url(http://cleanapp.cafe24.com/img/222.jpg  );
background-repeat:no-repeat

</style>

의 body style 를 아래처럼 바꿔보세요

제안1

Copy

<style type="text/css">
body{ background-image:url(http://cleanapp.cafe24.com/img/222.jpg  );
background-repeat:no-repeat;
background-size: 1600px 1078px;
background-position: center 110px;

</style>

제안1 적용시 실제 이미지 사이즈 크기를 중심으로 가운데 정렬이 됩니다
머리가 가려져서 위에서 110px 만큼 떨어뜨린 겁니다 (background-position: center 110px; )

2108916759_1586063280.6326.jpg

제안2

Copy

<style type="text/css">
body{ background-image:url(http://cleanapp.cafe24.com/img/222.jpg  );
background-repeat:no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
background-position: center 110px;
</style>

제안2 적용시 아래처럼 이미지실제 사이즈보다 모니터 화면에 꽉차게 가로폭이 커집니다

2108916759_1586063297.9399.jpg