2013-08-22 2 views
0

Phonegap 앱에서 작업 중이며 Android 용 장치의 글리프 글꼴에 대해 CSS 행 높이 및 여백 렌더링이 Chrome 용으로 컴파일 된 Phonegap 응용 프로그램과 다르게 적용되는 문제가 있습니다. 내 바탕 화면에.특별히 Android 용 CSS를 지정하는 방법이 있습니까

브라우저의 기능 (예 : -webkit, -moz 등)에서 일반적으로 볼 수있는 것과 비슷한 Android 스타일 렌더링 엔진 전용 CSS 스타일을 지정하는 방법이 있습니까?

사용하고있는 글꼴은 http://www.entypo.com/이고 특별히 문제가되는 CSS 스타일은 선 높이와 여백입니다. 응용 프로그램의 일반적인 글꼴에는 이와 같은 문제가 발생하지 않습니다.

답변

1

기기/환경을 감지 할 수 있으면 해당 기기에서 특별히 타겟팅하는 요소에 대한 서비스가 페이지의 <html> 태그에 클래스를 추가하는 것처럼 간단합니다. 그런 다음 해당 루트 클래스에서 스타일 선언을 호출하면됩니다. 예를 들어 : 장치를 검출로

.wrapper { 
    background: blue; /* will apply to all documents independent of device */ 
} 

.android .wrapper { 
    background: green; /* will only apply to documents with the .android base class */ 
} 

, 그것은 완전히 다른 질문입니다 만,이 방법을 사용하면 장치를 감지 할 수있는 가정 작동합니다. 안드로이드 코드에서

+0

감사 할 수 있습니다. 귀하의 답변을 기반으로 그것은 안드로이드 렌더링 엔진을위한 CSS 스타일을 선언 할 수있는 방법이 없다고 가정하는 것이 맞습니다. 다양한 브라우저에서 할 수있는 것처럼 말입니다. – activelogic

+0

글쎄, 당신은 정말로 그 장치 자체를 목표로 삼고 있지 않다. 당신은 그 장치의 브라우저를 목표로하고있다. 따라서 브라우저에 제한이 있다는 것을 알고 있고 해당 브라우저를 타겟팅하는 방법을 알고 있다면 위의 방법으로 특정 스타일을 적용 할 수 있습니다. 그러나 내가 아는 한 Android/Google 모바일 브라우저의 'Android'접두사는 없습니다. – monners

+0

빠른 응답을 보내 주셔서 감사합니다. 귀하의 솔루션을 구현했으며 매력적으로 작동합니다. 안타깝게도 Android 기기 용 CSS에는 선언이 없습니다. – activelogic

0

, 당신이 당신의 <body>에 "안드로이드"클래스를 추가합니다 당신 loadUrl()

this.sendJavascript("document.getElementsByTagName('body')[0].className = 'android'"); 

onCreate()에 추가하고 앱의 안드로이드 버전에 대한 특정 CSS 선택기를 사용하도록 할 수 있습니다 . 이미 <body>에 클래스를 적용하는 경우, 당신은 제안을

this.sendJavascript("document.getElementsByTagName('body')[0].className += ' android'"); 
+0

제안 해 주셔서 감사합니다. 귀하의 답변을 기반으로 그것은 안드로이드 렌더링 엔진을위한 CSS 스타일을 선언 할 수있는 방법이 없다고 가정하는 것이 맞습니다. 다양한 브라우저에서 할 수있는 것처럼 말입니다. – activelogic

+0

아마도 가장 가까운 곳은 -webkit을 사용하는 것일 수 있지만 아마 본 것만 큼 Android에만 영향을 미치지는 않습니다. 내가 아는 한, 안드로이드 장치에 특정한 CSS 선택기가 없습니다. – jprofitt

관련 문제