iOS 本地加载html登陆页面

Posted 2020-08-09

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了iOS 本地加载html登陆页面相关的知识，希望对你有一定的参考价值。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登陆页面</title>
    <link href="CSS/Login.css" rel="stylesheet">
</head>
<body>
<!--最外层-->
    <div id="content">
        <!--面板-->
        <div class="panel">
            <!--账号-->
            <div class="group">
                <label>账号</label>
                <input placeholder="请输入账号">
            </div>
            <!--密码-->
            <div class="group">
                <label>密码</label>
                <input placeholder="请输入密码" type="password">
            </div>
            <!--登陆-->
            <div class="login">
                <button>登陆</button>
            </div>
        </div>
        <!--注册-->
        <div class="reg">
            <button>创建新账号?</button>
        </div>
    </div>
</body>
</html>

CSS的代码

body{
    background-color: #f2f2f2;
}

#content{
    margin-top: 100px;
    /*background: red;*/
    text-align: center;
}

#content .panel{
    display: inline-block;
    background-color: white;
    border: 1px solid #ddd;
    border-radius:  5px;
    padding: 20px;
}

#content .panel .group{

}
/*s输入框*/
#content .panel .group input{
    display: block;
    width: 250px;
    height: 33px;
    padding-left: 7px;
    font-size: 15px;
    border: 2px solid #ddd;
}

/*伪类*/
#content .panel .group input:focus {
    outline: none;
    border-color: #CC865E;
}
#content .panel .group label{
    display: block;
    text-align: left;
    height: 30px;
    line-height:  30px;
    font-size: 20px;
}

#content .login{
    margin-top: 20px;
}
/*登陆*/
#content .login button{
    width: 250px;
    background-color: #CC865E;
}

#content .login button:hover{
    background-color: white;
    color: #CC865E;
    border: 1px solid #CC865E;
    cursor: pointer;
}

#content button{
    height:  33px;
    border: 0px;
    color: white;
    font-size:  18px;
    border-radius: 3px;
}

#content .reg{
    margin-top: 20px;
}

/*注册*/
#content .reg button{
    width: 250px;
    background-color: #466BAF;
}

#content .reg button:hover {
    background-color:white;
    color: #466BAF;
    border: 1px solid #466BAF;
    cursor: pointer;
}

ios 的代码

#import <UIKit/UIKit.h>

@interface AppDelegate : UIResponder <UIApplicationDelegate>

@property (strong, nonatomic) UIWindow *window;


@end

#import "AppDelegate.h"
#import "RootViewController.h"
@interface AppDelegate ()

@end

@implementation AppDelegate


- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    // Override point for customization after application launch.
    self.window.backgroundColor = [UIColor whiteColor];
    
    self.window.rootViewController = [[RootViewController alloc] init];
    
    [self.window makeKeyAndVisible];
    return YES;
}


@end

#import <UIKit/UIKit.h>

@interface RootViewController : UIViewController

@end

#import "RootViewController.h"

@interface RootViewController ()

@property (nonatomic , strong) UIWebView *webView;

@end

@implementation RootViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //html在本地的路径（/Users/apple/WebstormProjects/LoginPage/Login.html）
    NSURL *url = [NSURL fileURLWithPath:@"/Users/apple/WebstormProjects/LoginPage/Login.html"];
    NSURLRequest *request = [NSURLRequest requestWithURL:url];
    UIWebView *aWebView = [[UIWebView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    self.webView = aWebView;
    [self.webView loadRequest:request];
    [self.view addSubview:self.webView];

}
@end

以上是关于iOS 本地加载html登陆页面的主要内容，如果未能解决你的问题，请参考以下文章

我可以将整个 HTML 文档加载到 Internet Explorer 中的文档片段中吗？

iOS 加载本地HTML，css，js

Nuxt.js 本地站点页面仅在登陆时从 Strapi 加载数据，而不是通过 <nuxt-link> 导航

使用 WKWebView iOS 加载本地 HTML/Javascript

html 输入类型提交通常在单击时重新加载页面。此片段使输入不重新加载页面以便进行ajax调用

react-native-webview Android 无法正确加载本地html文件(显示源代码)