정보&강의

XE 위젯을 반응형으로 적용하자.

by 운영자 posted Dec 14, 2017
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부
Extra Form
재생하기

XE를 사용하면서 가장 불만인게 메인페이지의 위젯이 반응형으로 작동되지 않는다는 점이다.

반응형에 대한 수요는 많다. 또 많은 부분에서 반응형에 대한 요구사항을 반영하여 업데이트를 하는데 유독 위젯에서의 반응형 지원은 되지 않는 것이 이해가 되지 않는다.

 

이 문제로 모바일 스킨을 별도로 구매하는 경우도 있는 듯한데 더 이상 골치 아프지 말도록 하자.

 

그럼 위젯을 반응형으로 적용하는 방법을 알아보자.

방법은 아주 간단하다.

 

 

먼저, 위젯 크기를 적용하는 화면에서 위젯 CSS Class 명을 적어준다.

예제에서는 xe-widget이라고 적었다.

 

image.png

 

다음으로 자신이 원하는 위젯스타일을 적용한다. 

그리고 위젯스타일의 CSS 파일을 아래와 같이 수정한다.

 

@media screen and (max-width:639px){
.xe-widget { width: 100% !important; box-sizing:border-box; }

}

@media screen and (min-width: 640px){
.xe-widget { width: 49% !important; box-sizing:border-box; }

}

 

이용시 참고할 점.

1. max-width 값과 min-width 값은 원하는 값으로 수정하면 된다.

2. 이 방법은 모든 위젯스타일에 적용할 수 있다.

 


#xe-widget  #screen  #min-width #위젯 #반응형 #모바일스킨 #반응형지원 #widget #스타일 #불만

짧은주소 : https://goo.gl/BVvhn3

List of Articles
번호 분류 제목 날짜 조회 수 글쓴이
공지 공지 구글 무제한 드라이브 이용자 공지사항 3 2017.10.30 599 운영자
공지 공지 구글 드라이브 무제한 클라우드 G-Suite 가입하실 분 모집합니다. 9 file 2017.10.30 1947 운영자
14144 정보&강의 포트스캔 유형분석 1 file 2008.10.07 3546 인터미션
14143 정보&강의 주차스티커!! 손쉽게 떼는 방법 4 file 2008.07.15 12845 인터미션
14142 가입인사 방금 가입했습니다! 2 2017.12.24 55 켄카
14141 가입인사 안녕하세요~ 방금 가입했습니다. 6 2017.12.24 102 앵엥앵엥
14140 자유글 메리 크리스마수~ 1 2017.12.25 31 김세광
14139 자유글 성탄카드   1 file 2017.12.24 25 위위
14138 정보&강의 Youtube 백그라운드 재생 어플 - 안드로이드용 Youtube 백그라운드로 내려가도 계속 찬양및 설교가 흘러 나옵니다. 설치하고 그냥 유투브같이 검색해서 찾아서 사용하시면 됩니다. 구글계정으로 로그인하여 사... 7 file 2017.11.22 365 장성수
14137 자유글 어제 중국 기자 폭행현장에 있었습니다 (펌)   원글 :  http://www.ppomppu.co.kr/zboard/zboard.php?id=freeboard&no=5592069    안녕하세요 중국 인터넷 환경이 증말 그지같아서 이제야 뉴스들을 좀 보... 1 file 2017.12.15 81 장성수
14136 정보&강의 윈도우용 베들레헴 성경 4.1.0 세례 버전 4 2017.12.22 393 HarryKwag
14135 가입인사 가입인사 1 2017.12.18 21 aizi
14134 가입인사 가입인사드립니다. 1 2017.12.21 14 로닌
14133 포인트요청 카카오뱅크로 입금했습니다. 확인후 충전 부탁합니다. 1 2017.12.21 41 DavidPaul
14132 질문글 비번 변경 2 2017.12.18 56 김인선
14131 자유글 생큐로드 2017.12.18 29 장성수
14130 자유글 구글 인공지능 태그 방식 2017.12.18 26 운영자
14129 자유글 아 눈물이.. ㅠㅠ 가위바위보 게임을 도입하고 오늘 한번 들어가 봤는데요.. 가입하신지 얼마 안되신 회원분이신데.. 눈물이.. ㅠㅠ 신입이시면 300포인트 큰 점수인데.. 안타깝습... 6 file 2017.12.14 52 운영자
14128 정보&강의 교회 사역자 회의를 고민하다? 구글 화이트보드 - 잼보드 먼저 아래, 구글에서 소개하는 잼보드 영상을 보시죠. https://youtu.be/3BgVtlyQMqc https://youtu.be/-RaT2sHL4aw 잼보드는 원래 55인치 4K 화이트보드를 이용... 2 file 2017.12.02 63 운영자
» 정보&강의 XE 위젯을 반응형으로 적용하자. XE를 사용하면서 가장 불만인게 메인페이지의 위젯이 반응형으로 작동되지 않는다는 점이다. 반응형에 대한 수요는 많다. 또 많은 부분에서 반응형에 대한 요구사... file 2017.12.14 294 운영자
14126 공지 인공지능으로 태그를 자동으로 입력해줍니다. 2017.12.14 39 운영자
14125 질문글 베들레헴 원어 폰트가 이상해요 베들레헴 성경을 윈도우 8.1에 설치해서 사용중입니다. 히브리어 폰트 헬라어 폰트 설치했는데도 원어 성경 폰트중에 네모로 나옵니다 방법이 있는지요     3 file 2017.12.12 97 김봉옥
Board Pagination Prev 1 ... 5 6 7 8 9 10 11 12 13 14 ... 717 Next
/ 717


기독교 멀티미디어 전문사역자 커뮤니티 admin@godpeople.or.kr Copyright © Since 2001~Now godpeople.or.kr All rights reserved.