헤더 슬라이더 사이즈 수정 방법
2016.12.13 13:25
455
2
- - 짧은주소 : http://e3net.fineyes.com/bbs/?t=qF
본문
안녕하세요.
다름이 아니고 헤더 슬라이더 사이즈 수정 어디서 하나요?
질문게시판 검색 결과도 정확하지 않습니다.
자세한 설명 부탁드립니다.
고맙습니다.
0
로그인 후 평가 가능합니다.
-
부끄럼소년
- 회원등급 : 지상계 / Level 6
포인트 7,768
경험치 3,856
[레벨 6] - 진행률
72%
- 가입일 : 2016-04-04 09:40:18
- 서명 : 미입력
- 자기소개 : 미입력
댓글목록 2
이윰EGG님의 댓글
- 아이디로 검색
2016.12.13 16:25사이즈를 어떻게 수정할지에 대한 구제적인 질문이 없어 높이 수정에 대해서만 답해드립니다.
/eyoom/theme/테마명/css/style.css 파일 'Header Slider' 부분을 검색 이동하면 아래 관련 css 소스가 있으며 관련해서 수정을 하면 되겠습니다.
높이는 .header-slider-bg 에 height 값이 있으며 이를 수정하면 됩니다.
반응형에 맞춰 수정을 한다면 아래와 같은 형식을 응용하면 되겠습니다.
767px 이하일때
768px 이상일때
감사합니다.
축하합니다. 첫댓글 포인트 63포인트를 획득하였습니다.
부끄럼소년님의 댓글
- 아이디로 검색
2016.12.13 18:09답변 고맙습니다.
아래 부분에서 높이는 200px으로 수정을 했습니다.
하지만 가로 길이는 어느부분을 수정해야하는지요?
송구하지만 구체적으로 답변 부탁드립니다.
-------------------------------------------------------------------------------------------------------------------------------------------------------------
/*---------- Header Slider ----------*/
.header-slider-bg {z-index:1;padding:110px 0;position:relative;overflow:hidden;text-align:center;height:200px}
.header-slider-bg:after {position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;content:" ";background:rgba(0,0,0,0.35)}
.header-slider-bg > img {position:absolute;top:0;left:0}
.header-slider-bg > .container {position:relative;z-index:3}
.header-slider-bg h1 {color:#fff;font-size:24px;font-weight:600;text-transform:uppercase;margin:0}
.header-slider-bg h2 {font-size:14px;font-weight:600;color:#fff;margin:10px 0 30px}
.header-slider-bg p {color:#ededed;font-size:12px;font-weight:200;margin:0}
@media (min-width: 768px) and (max-width: 991px) {
.header-slider-bg {padding:100px 0 0}
}
@media (max-width: 767px) {
.header-slider-bg {padding:70px 0 0;height:250px}
.header-slider-bg h1 {font-size:24px;line-height:40px;margin-bottom:20px}
.header-slider-bg p {display:none}
}
@media (max-width: 430px) {
.header-slider-bg {padding:40px 0 0;height:180px}
.header-slider-bg h1 {font-size:18px;margin-bottom:10px}
.header-slider-bg h2 {font-size:12px}
-------------------------------------------------------------------------------------------------------------------------------------------------------------