webview显示html代码，并设置html中字体的大小，获得webview高度

最新推荐文章于 2023-05-04 20:39:17 发布
最新推荐文章于 2023-05-04 20:39:17 发布
阅读量3.4k 收藏
点赞数
分类专栏： iOS代码块 文章标签： uiwebview webview高度 html字体大小
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/csdnAaron/article/details/45914419
版权

ios开发中有时会遇到html的显示，那webview就派上用场了，下面对webview展示代码如何设置html中字体大小，和webview的高度。另外通过webview的代理方法，也可以获得webview的高度

UIWebView *questWebView = [[UIWebView alloc]init];
    questWebView.frame = CGRectMake(flagBtn.width + 10 + 10, flagBtn.y, SCREEN_WIDTH- (flagBtn.width + 20 +10), 30);

    //不滚动
    UIScrollView *questScrollView =  [questWebView.subviews objectAtIndex:0];
    questScrollView.scrollEnabled = NO;

    // 字体的大小
    NSString *BookStr = [NSString stringWithFormat:@"<html> \n"
                         "<head> \n"
                         "<style type=\"text/css\"> \n"
                         "body {margin:0;font-size: %f;}\n"
                         "</style> \n"
                         "</head> \n"
                         "<body>%@</body> \n"
                         "</html>",13.0,content];
                         //此处content为要设置字体大小的html内容代码

 //此处BookStr为要显示的html代码
    [questWebView loadHTMLString:BookStr baseURL:nil];

//获得webview高度
    CGFloat webHeight = [[questWebView stringByEvaluatingJavaScriptFromString:@"document.body.offsetHeight"] floatValue];
徐文-Kevin
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
解决因为手机设置字体大小导致h5页面在webview中变形的BUG
FungLeo's Blog
06-15 2万+
解决因为手机设置字体大小导致h5页面在webview中变形的BUG首先，我们做了一个H5页面，在各种手机浏览器中打开都没问题。我们采用了rem单位进行布局，通过JS来动态计算网页的视窗宽度，动态设置html的font-size，一切都比较完美。这时候，你自信满满的将h5地址交给了APP工程师，做了一个WEBVIEW嵌套，然后就顺利交工了。测试组在一堆手机中测试APP，突然，在某个手机上打开，你的页面
webview_flutter加载HTML文本字体过小的解决
Alexander Wei的博客
08-25 2196
使用webview_flutter框架加载html代码以显示HTML文本编辑器样式的内容，发现字体太小。回调方法中加载，即可正常显示。
html在手机浏览器如何设置字体大小
nox
05-22 4519
动态计算好html的font-size之后，我们设置的大小不一定是真实的大小，所以，我们需要在设置完字体大小之后，再去重新获取一下html的font-size，看看实际的这个值(webview受到系统字体设置大小的一个你想)，和我们设置的是不是一样。如果不一样，就要根据比例再设置一次。 tag：解决因为手机设置字体大小导致h5页面在webview中变形的BUG。 ...
Flutter WebView遇到的坑
star_nwe的博客
05-04 864
如果你做过原生 Android 开发，在 Android 平台的 WebView 中，默认 WebView 同样是不支持 input file 类型标签的，需要自己根据 WebView 提供的回调函数来实现对应的功能。相比 iOS 就简单了，iOS 的 WebView 默认就实现了这些功能，做 Android 开发的同学都会投来羡慕的眼神，为了让 WebView 支持这些功能，Android 开发同学需要自己实现拍照、从相册、从文件里选取图片，然后回传给 WebView ，这样 H5 里的文件选择标签才能生
android基于webview嵌入html5的字体大小设置
jingsi1991的博客
11-30 3801
情景： android手机上继续webview嵌入的html5的页面，当手机系统的字体大小发生变化时，导致页面的字体跟随变化，进而引起页面布局错乱。而在ios上貌似不会更随系统字体的变化而发生变化。 需求： 不论系统字体大小如何变化，页面字体大小、元素布局保持不变。 解决方法： 在webview进行设置：webview.getSettings().setTextZoom(100);
Android开发WebView之加载HTML源码修改HTML字体大小以及缩放HTML的方法
xiayiye5的博客
07-11 1867
老套路上图： 再看下缩放功能： 先说下设置HTML网页字体大小的方法： //设置网页字体大小 webview.getSettings().setTextSize(WebSettings.TextSize.LARGEST);//已弃用，默认值为100也就是不放大字体 //新方法 webview.getSettings().setTextZoom(250);默认值为100也就是不放大字体 再看下缩放方法： // 设置可以支持缩放，两个方法必须同时设置，设置后或出现放大加号.
android webview获取html代码和根据id获取value实例
01-03
最近做一个项目，需要webview获取网页中input的内容，把知识整理一下，做个记录，也希望对大家有所帮助。 2 获取html内容 2.1 初始化webview webview.getSettings().setJavaScriptEnabled(true); webview....
IOS中的webView加载HTML
09-02
在日常开发中，我们为了效率会用到很多很多的WebView,比如在做某个明细页面的时候我们返回给你的可能是一个html字符串，我们就需要将当前字符串展示到webView上面，所以我们对HTML标签需要有一定的认识，下面我们来...
关于Android中WebView远程代码执行漏洞浅析
01-04
1. WebView 远程代码执行漏洞描述  Android API level 16以及之前的版本存在远程代码执行安全漏洞，该漏洞源于程序没有正确限制使用WebView....该漏洞最早公布于CVE-2012-6636【1】，其描述了WebView中addJava
iOS中精确计算WebView高度的方法示例
01-04
前言 在开发app的过程中难免会遇到将webView加载到tableView的cell上的需求，一般遇到这种问题，通常想到的思路就是在webView的回调方法webViewDidFinishLoad中获取到webView的高度,刷新tableView，将高度赋值给tableView的回调方法heightForRow。看似没有任何问题，但是在实际操作的时候却发现得到的高度并不是webView的实际高度，显然这种方法是行不通的。其实并不是方法不行，而是webViewDidFinishLoad代理方法被调用时，页面并不一定完全展现完成，可能有图片还未加载出来，导致此时获取的高度是并不是最终高度，过会
iOS中通过设置CSS改变WebView字体大小，颜色，背景颜色
lvchaman的专栏
05-16 4461
原文链接：http://www.mamicode.com/info-detail-998985.html 标签： 因为WebView自带的属性是不可以改变字体大小颜色这些需求的，只能通过改变css样式，内置来解决。在百度上搜了半天很多不靠谱，现在给出几种解决方案如下: 1.第一种方式：在WebView的代理方法webViewDidFinishLoad中： 字体大小： [webV
更改WebView的字体大小
lxm20819的专栏
04-11 830
上次总结了一下WebView更改字体大小的帖子，这次在加点料，索性把webView的字体颜色和背景颜色都设置一下。   现在的App大多数支持日夜间模式的切换，对于新闻阅读类的App，更改WebView的日夜间模式，显得尤为重要。更改字体颜色，主要的思想是在WebView加载的Data的外面，加载了一个模板，然后根据用户日夜间模式切换的点击事件，更改WebView的字体颜色。其实这里例子懂了之后，
html中设置字体字号,html中设置字体大小的方法
热门推荐
weixin_42525482的博客
05-30 2万+
html中设置字体大小的方法发布时间：2020-12-08 09:49:46来源：亿速云阅读：163作者：小新这篇文章将为大家详细讲解有关html中设置字体大小的方法，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。设置html字体大小的方法：1、【font-size】后面加px值的方式；2、使用inherit继承父元素的字体大小；3、设置固定的几个值；4、设置sm...
html网站手机最小字体大小,html在手机浏览器如何设置字体大小
weixin_30771489的博客
05-31 785
动态计算好html的font-size之后，我们设置的大小不一定是真实的大小，所以，我们需要在设置完字体大小之后，再去重新获取一下html的font-size，看看实际的这个值(webview受到系统字体设置大小的一个你想)，和我们设置的是不是一样。如果不一样，就要根据比例再设置一次。tag：解决因为手机设置字体大小导致h5页面在webview中变形的BUG。1、你的页面采用了rem单位，并且是采...
移动端自适应布局与字体大小
low666的博客
04-10 3123
移动端自适应布局与字体大小 vw, vh实现 vw：根据可视区的宽度来计算的，100vw相当于宽度为100%，10vw则相当于10%。 vh：根据可视区的高度来计算的，和vw换算方式一样。 font-size:10vw。如果浏览器可视区宽度为320px的话，那么字体大小为32px，以此类推。 <!DOCTYPE html> <html> <head> ...
iOS WKWebView加载HTML字体大小问题
ANDY_GUO_wei的专栏
07-21 1485
NSString *jScript = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);"; WKUserScript *wkUScript = [...
html 字号自适应,html自适应网页里字体大小自适应屏幕的方法
weixin_33481663的博客
05-30 4094
html自适应网页里字体大小自适应屏幕的方法发布时间：2020-11-20 16:40:22来源：亿速云阅读：216作者：小新这篇文章主要介绍了html自适应网页里字体大小自适应屏幕的方法，具有一定借鉴价值，需要的朋友可以参考下。希望大家阅读完这篇文章后大有收获。下面让小编带着大家一起了解一下。字体大小使用 em,rem作为单位，然后使用 media query 来调整 html 元素的 fo...
ios 载入html 尺寸,iOS WKWebView加载HTML字体大小问题
weixin_29359133的博客
05-31 650
NSString *jScript = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].app...
uniapp webview显示html源代码
最新发布
09-19
Uniapp提供了webview组件用于显示一个网页，通过设置src属性指定要显示的网址。但是，webview组件默认是将网页以正常的方式渲染出来，而不是显示网页的源代码。 如果想要在Uniapp中显示网页的源代码，可以通过以下步骤实现： 1. 安装并导入'uni-app-plus'插件：在Uniapp项目根目录下，执行命令 npm install uni-app-plus。 2. 在需要显示网页源代码的页面中，注册并使用webview组件。 3. 在webview组件的创建事件中，通过调用uni-app-plus插件中的evalJS方法，执行JavaScript代码获取网页的源代码。 ```vue <template> <view> <web-view :src="url" @created="webviewCreated"></web-view> </view> </template> <script> export default { data() { return { url: 'http://www.example.com' // 要显示的网页地址 }; }, methods: { webviewCreated(webview) { webview.addEventListener('load', () => { // 获取网页源代码 webview.evalJS(` uniappPlus.invokeJS({ type: 'evalJS', data: 'document.documentElement.outerHTML' }); `); }); // 监听uniappPlus.invokeJS返回的数据 uniappPlus.onInvokeJS(data => { console.log(data); // 在控制台打印出网页源代码 }); } } }; </script> ``` 上述代码中，通过webviewCreated方法在webview组件被创建后执行，然后在load事件中调用evalJS方法通过JavaScript代码获取网页的源代码。最后，通过uniappPlus.onInvokeJS方法监听到返回的数据，可以在控制台打印出网页的源代码。 请注意，在使用uni-app-plus插件之前，请确保你的项目满足uni-app-plus的使用条件，并且已经在manifest.json文件中添加了插件声明。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值