Android Webview не реализует CSS

Я создаю приложение для Android с веб-просмотром. Я планирую разместить на сервере все файлы PHP, HTML5, CSS и Javascript. Я использую JQuery Mobile framework.Android Webview не реализует CSS

Вот код, который открывает WebView:

WebView myWebView = (WebView) findViewById(R.id.webview); 
WebSettings webSettings = myWebView.getSettings(); 
webSettings.setJavaScriptEnabled(true); 
myWebView.setWebViewClient(new WebViewClient()); 
myWebView.loadUrl("http://thefinddroid.com/TriviaGame");

Вот файл CSS:

img.option { 
    paddding:5px; 
    border:3px solid #FFFFFF; 
    -webkit-border-radius:5px; 
    -moz-border-radius:5px; 
    border-radius:5px; 
} 
#text_question { 
    font-size:25px; 
    text-align: center; 
} 
img.question { 
    padding:5px; 
    border:4px solid #FFFFFF; 
    -webkit-border-radius:5px; 
    -moz-border-radius:5px; 
    border-radius:5px; 
} 
#offer { 
    display:block; 
    width:480px; 
    margin:10px; 
    height:20px; 
    padding:5px; 
    -webkit-border-radius:10px; 
    color:#000000; 
    -moz-border-radius:10px; 
    border-radius:10px; 
    border:3px solid #DBDBDB; 
}

Вот часть моего HTML файла загружает CSS:

<link rel="stylesheet" 
     href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> 
<link rel="stylesheet" href="styles/styles.css" /> 
<script src="js/jqm_171.js"></script> 
<script src="js/jqm120_alpha.js"></script>

Вот код HTML5 внутри тела тега:

<body> 
    <div align="center" data-role="page" data-theme="b"> 
     <div data-role="header"> 
      <h1>Trivia Game</h1> 
     </div> 
     <div data-role="content"> 
      <div data-role="fieldcontain"> 
       <h1>Question #1</h1> 

       <img class="question" 
             src="images/q1.jpg" 
             align="center" /> 
       <div id="text_question"> 
        <p>Which guitar is used in this picture?</p> 
       </div> 

       <table cellspacing="10"> 
        <tr> 
         <td> 
          <img class="option" 
          id="option_1" 
          src="images/c1.jpg" 
          onclick="selected_option(1)" /> 
         </td> 
         <td> 
          <img class="option" 
          id="option_2" 
          src="images/c2.jpg" 
          onclick="selected_option(2)" /> 
         </td> 
        </tr> 
         <td> 
          <img class="option" 
          id="option_3" 
          src="images/c3.jpg" 
          onclick="selected_option(3)" /> 
         </td> 
         <td> 
          <img class="option" 
          id="option_4" 
          src="images/c4.jpg" 
          onclick="selected_option(4)" /> 
         </td> 
        </tr> 
       </table> 

       <br /> <br /> 
       <div id="offer">To learn more on Stylist : 
       Article, Links and Benfits - <a href="#">Click here</a></div> 
      </div> 
     </div> 
    </div> 
</body>

Это сценарий:

Когда я открыть веб-страницу в моем компьютере браузер, все работает нормально. Все мои стили CSS работают хорошо.
Когда я впервые открываю веб-страницу в своем браузере Android (без перезагрузки), стили CSS не отображаются. Но когда я обновляю его, он отобразит стили CSS.
Когда я открываю приложение, которое я создал, CSS не работают. Все стили CSS не отображаются в моем приложении.

Скриншот Заявке (не реализует CSS): This is the screenshot of the application, it does not show CSS

Скриншот из браузера Android (Реализации CSS) This is the screenshot of the browser, it shows CSS

источник

2013-04-25 JetPro

Одинаково ли это в браузере Android? – NoBugs

@NoBugs Каждый скриншот описан в моем вопросе. Первый - это скриншот приложения, а второй - скриншот браузера моего устройства Android. Другое дело, браузер реализует css, а приложение - нет. – JetPro

Я знаю, что это старый, но вы пробовали абсолютные URL-адреса для вашего CSS? – georgiecasey

-5

Android обыкновению поддерживает таблицу тегов. В вашем html содержится тег таблицы, поэтому u не получил правильного представления.

Android поддерживает только теги html.

<a href="..."> 
<b> 
<big> 
<blockquote> 
<br> 
<cite> 
<dfn> 
<div align="..."> 
<em> 
<font size="..." color="..." face="..."> 
<h1> 
<h2> 
<h3> 
<h4> 
<h5> 
<h6> 
<i> 
<img src="..."> 
<p> 
<small> 
<strike> 
<strong> 
<sub> 
<sup> 
<tt> 
<u>

источник

2013-04-25 05:36:40 vinoth

Могу я знать, почему и дал мне голос. – vinoth

FYI, я не был тем, кто дал свой ответ на голосование. Можете ли вы дать мне источник вашего ответа? Возможно, некоторые документы или статьи ... Я не могу полностью понять, что вы заявляете. – JetPro

Если вы посмотрите на мой код, я также использовал div для CSS, и все же он не появляется. – JetPro

Android Webview не реализует CSS

ответ

Смежные вопросы