HTML, 어떻게 화면에 웹 페이지를 넣을 수 있습니까?

나는 안드로이드 용 응용 프로그램을 개발 중입니다. 내 응용 프로그램은 일부 고품질 이미지 때문에 매우 큰 크기 (APKfile)가 있습니다. 나는 그것을 서버와 앱으로 옮기기로 결정했다. 웹 페이지를로드하고 웹 페이지를 통해 보여 주기만했다. 각 HTML 페이지에는 하나의 이미지 (텍스트 및 기타 항목 없음)가 있고 모든 이미지의 폭은 450 픽셀이지만 높이는 이미지마다 다를 수 있습니다. 웹 페이지를로드 할 때 이미지가 화면에 맞지 않아서 내 화면보다 큽니다. 화면에 맞는 이미지가 있어야합니다.HTML, 어떻게 화면에 웹 페이지를 넣을 수 있습니까?

내가 서버에서 이미지를로드 할 수 있다는 것을 알고 있지만 화면 비율이 좋지 않아 이미지가 부숴졌습니다. 너비가 늘어나고 높이가 적용되지 않았다. 내가 사용한 코드는 android:scaleType="fitXY"

입니다. 왜냐하면 어떤 이유로 코드를 완전히 바꾸고 싶지 않고 html 파일에 변경 사항을 적용하는 방법을 선호하기 때문입니다. 내 html 파일은 다음과 같습니다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <title>Team Championship</title> 
    </head> 


    <body> 
     <img align="left" alt="Team Championship" src="../image/team_championship.png"/> 

    </body> 
</html>

모든 장치에서 이미지를 어떻게 표시 할 수 있습니까? 죄송합니다. 안드로이드 프로그래밍에서 나쁘지는 않지만 웹 프로그래밍에 익숙하지 않습니다. 감사

출처

2012-02-27 Hesam

이미지를 늘리고 싶지 않으면 'scaleType'에 'CENTER_INSIDE'를 사용하십시오. 'FITXY'는 이미지를 컨테이너와 같은 크기로 만들 것입니다. 컨테이너의 가로 세로 비율이 다른 경우에는 작동하지 않습니다. –

고마워,

하지만 쉽고 빠른 방법은 여기에 위의 이미지 코드를 변경한다 :

<img align="left" alt="Abudhabi" src="../image/track_abudhabi.png" width="100%"/>

이제 모든 장치에 이미지가 화면에 적합합니다.

출처

2012-02-27 08:13:53 Hesam

당신이 당신의 이미지의 크기를 알고 있다면, 당신은 그냥 높이에 대한 검사를 추가하여 웹보기의 규모, 예컨대 :

DisplayMetrics displayMetrics = new DisplayMetrics(); 
getWindowManager().getDefaultDisplay().getMetrics(displayMetrics); 

int imgWidth = ...; 
int imgHeight = ...; 

if(imgWidth > displayMetrics.widthPixels) { 
    int scaleInPercent = 100 * displayMetrics.widthPixels/imgWidth; 
    m_webView.setInitialScale(scaleInPercent); 
}

를 설정할 수 있습니다 당신이 갈 수 있어야한다.

출처

2012-02-27 07:19:17 Macondo2Seattle

모바일 웹 사이트에서 작업하고있었습니다. 테스트 장비는 iPod Touch와 2 대의 안드로이드 폰이었다. 아이팟 터치에는 문제가 없지만 안드로이드 폰은 이미지를 풀 사이즈로 만들 것을 주장했다. 따라서 이미지의 약 25 % 만 볼 수 있습니다. 나는 "그래픽으로 장치에 맞는 웹 페이지"를 검색했고, 그것은 나를 여기로 이끌었다.

width = "100 %"의 추가는 문제 해결에 필요한만큼 정확하게 수행되었습니다. 단순한! 감사.

출처

2012-03-30 21:30:31 Audra

당신이 웹보기를 사용하는 경우, 제일과 가장 간단한 방법은 헤드 태그 안에 스타일 태그를 추가하는 것입니다 : 이것처럼

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <style> 
      img{ 
       max-width:100%; 
       height:auto; 
       display:block; 
       margin-left:auto; 
       margin-right:auto; 
      } 
     </style> 
     <title>Team Championship</title> 
    </head> 


    <body> 
     <img align="left" alt="Team Championship" src="../image/team_championship.png"/> 

    </body> 
</html>

는, 모든 이미지는 적합 및 중심.

출처

2014-02-26 13:24:48 Nissar

HTML, 어떻게 화면에 웹 페이지를 넣을 수 있습니까?

답변

관련 문제