在移動應用中使用WebView來展示網頁已經成為了常見的做法。同時我們也需要為這些展示的網頁加上自己的樣式來適應自己的應用風格。這時我們可以使用 WebView CSS。
WebView webView = (WebView) findViewById(R.id.webView); WebSettings webSettings = webView.getSettings(); webSettings.setJavaScriptEnabled(true); webSettings.setDomStorageEnabled(true); String css = "img{max-width: 100%; height: auto;}";//設置圖片自適應屏幕寬度 String html = ""+content+"";//將CSS樣式加入html內容中 webView.loadDataWithBaseURL(null, html, "text/html", "utf-8", null);//調用WebView中的loadDataWithBaseURL方法將加入樣式的html內容加載到頁面上。
在代碼中,我們首先獲取了Webview對象和WebSettings對象。使用WebSettings對象的setJavaScriptEnabled()和setDomStorageEnabled()方法,使得 Webview 支持 JavaScript 和本地存儲,這是展示 Webview 內容的前提。然后我們設置了一個小的 css 樣式,使得圖片能適應屏幕寬度,最后將 css 樣式加到 html 的 head 標簽內,并將其加載到 WebView 上。
以上代碼僅僅是處理了圖片自適應屏幕寬度,實際中還可以根據需求對Webview的樣式進行自由的定制。這對于開發者來說非常的方便。同時我們要注意在加載時要指定字符編碼utf-8,避免亂碼問題的出現。
上一篇web中加入css
下一篇web前端開發 css