VB6之WebBrowser控件

浏览数：285 / 时间：2015年06月09日

UI短手或者GDI+用烦的童鞋可以借用WebBrowser打造漂亮的程序界面，只需要下载一个好看点的html代码就够了。

引用：

　　Microsoft Html Object Library

部件：

　　Microsoft Internet Controls

 

这里以一个简单的登陆界面作为示例，实现代码：

Private WithEvents HtmlDocument As MSHTML.HtmlDocument
Private WithEvents HtmlElement As MSHTML.HTMLButtonElement

‘code by lichmama from cnblogs.com
Private Sub Form_Load()
    With WebBrowser1
        .Left = 0
        .Top = 0
        .Navigate "file://C:\Users\Administrator\Desktop\test.html"
    End With
End Sub

Private Sub Form_Resize()
    With WebBrowser1
        .Width = Me.Width
        .Height = Me.Height
    End With
End Sub

Private Sub Form_Unload(Cancel As Integer)
    Set HtmlElement = Nothing
    Set HtmlDocument = Nothing
End Sub

Private Sub WebBrowser1_DocumentComplete(ByVal pDisp As Object, URL As Variant)
    With WebBrowser1
        ‘get the HtmlDocument from webbrowser,
        ‘   and bind the control of button to[HtmlElement],
        ‘   and setup the event handler of [mybutton]‘s onclick.
        Set HtmlDocument = .Document
        Set HtmlElement = HtmlDocument.getElementById("submit")
    End With
End Sub

Private Function HtmlDocument_oncontextmenu() As Boolean
    ‘屏蔽右键菜单
    HtmlDocument_oncontextmenu = False
End Function

Private Function HtmlElement_OnClick() As Boolean
    ‘in this section, we can do any operations to current page.
    ‘   think about it, if this is a submit button, we could verify the password, whatever.
    username = HtmlDocument.getElementById("login_username").Value
    password = HtmlDocument.getElementById("login_password").Value
    Debug.Print "your username:", username
    Debug.Print "your password:", password
    HtmlElement_OnClick = False
End Function

 

test.html（@http://www.jb51.net/css/97304.html）：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
 <head>
  <title>纯CSS3制作的 登录模板 简洁蓝白(非IE效果更好)</title> 
  <meta content="text/html; charset=unicode" http-equiv="Content-Type" /> 
  <style> 
h1, h2, h3, h4, h5, h6{ 
font-weight:normal; 
margin:0; 
line-height:1.1em; 
color:#000; 
} 
h1{font-size:2em;margin-bottom:.5em;} 
h2{font-size:1.75em;margin-bottom:.5142em;padding-top:.2em;} 
h3{font-size:1.5em;margin-bottom:.7em;padding-top:.3em;} 
h4{font-size:1.25em;margin-bottom:.6em;} 
h5,h6{font-size:1em;margin-bottom:.5em;font-weight:bold;} 
p, blockquote, ul, ol, dl, form, table, pre{line-height:inherit;margin:0 0 1.5em 0;} 
ul, ol, dl{padding:0;} 
ul ul, ul ol, ol ol, ol ul, dd{margin:0;} 
li{margin:0 0 0 2em;padding:0;display:list-item;list-style-position:outside;} 
blockquote, dd{padding:0 0 0 2em;} 
pre, code, samp, kbd, var{font:100% mono-space,monospace;} 
pre{overflow:auto;} 
abbr, acronym{ 
text-transform:uppercase; 
border-bottom:1px dotted #000; 
letter-spacing:1px; 
} 
abbr[title], acronym[title]{cursor:help;} 
small{font-size:.9em;} 
sup, sub{font-size:.8em;} 
em, cite, q{font-style:italic;} 
img{border:none;} 
hr{display:none;} 
table{width:100%;border-collapse:collapse;} 
th,caption{text-align:left;} 
form div{margin:.5em 0;clear:both;} 
label{display:block;} 
fieldset{margin:0;padding:0;border:none;} 
legend{font-weight:bold;} 
input[type="radio"],input[type="checkbox"], .radio, .checkbox{margin:0 .25em 0 0;} 
/* base */ 
body, table, input, textarea, select, li, button{ 
font:1em "Lucida Sans Unicode", "Lucida Grande", sans-serif; 
line-height:1.5em; 
color:#444; 
} 
body{ 
font-size:12px; 
background:#c4f0f1; 
text-align:center; 
} 
/* login form */ 
#login{ 
margin:5em auto; 
background:#fff; 
border:8px solid #eee; 
width:500px; 
-moz-border-radius:5px; 
-webkit-border-radius:5px; 
border-radius:5px; 
-moz-box-shadow:0 0 10px #4e707c; 
-webkit-box-shadow:0 0 10px #4e707c; 
box-shadow:0 0 10px #4e707c; 
text-align:left; 
position:relative; 
} 
#login a, #login a:visited{color:#0283b2;} 
#login a:hover{color:#111;} 
#login h1{ 
background:#0092c8; 
color:#fff; 
text-shadow:#007dab 0 1px 0; 
font-size:14px; 
padding:18px 23px; 
margin:0 0 1.5em 0; 
border-bottom:1px solid #007dab; 
} 
#login .register{ 
position:absolute; 
float:left; 
margin:0; 
line-height:30px; 
top:-40px; 
right:0; 
font-size:11px; 
} 
#login p{margin:.5em 25px;} 
#login div{ 
margin:.5em 25px; 
background:#eee; 
padding:4px; 
-moz-border-radius:3px; 
-webkit-border-radius:3px; 
border-radius:3px; 
text-align:right; 
position:relative; 
} 
#login label{ 
float:left; 
line-height:30px; 
padding-left:10px; 
} 
#login .field{ 
border:1px solid #ccc; 
width:280px; 
font-size:12px; 
line-height:1em; 
padding:4px; 
-moz-box-shadow:inset 0 0 5px #ccc; 
-webkit-box-shadow:inset 0 0 5px #ccc; 
box-shadow:inset 0 0 5px #ccc; 
} 
#login div.submit{background:none;margin:1em 25px;text-align:left;} 
#login div.submit label{float:none;display:inline;font-size:11px;} 
#login button{ 
border:0; 
padding:0 30px; 
height:30px; 
line-height:30px; 
text-align:center; 
font-size:14px; 
Font-Weight:bold; 
color:#fff; 
text-shadow:#007dab 0 1px 0; 
background:#0092c8; 
-moz-border-radius:50px; 
-webkit-border-radius:50px; 
border-radius:50px; 
cursor:pointer; 
} 
#login .forgot{text-align:right;font-size:11px;} 
#login .back{padding:1em 0;border-top:1px solid #eee;text-align:right;font-size:20px;} 
#login .error{ 
float:left; 
position:absolute; 
left:95%; 
top:-5px; 
background:#890000; 
padding:5px 10px; 
font-size:11px; 
color:#fff; 
text-shadow:#500 0 1px 0; 
text-align:left; 
white-space:nowrap; 
border:1px solid #500; 
-moz-border-radius:3px; 
-webkit-border-radius:3px; 
border-radius:3px; 
-moz-box-shadow:0 0 5px #700; 
-webkit-box-shadow:0 0 5px #700; 
box-shadow:0 0 5px #700; 
} 
</style> 
  <style id="wiz_custom_css" type="text/css"> 
body 
{ 
font-family: 微软雅黑,Georgia,Helvetica,Arial,sans-serif,宋体,serif; 
font-size: 10.5pt; 
line-height: 1.5;
border:0px;
overflow:hidden;
} 
html, body, div, span, applet, object, iframe, p, blockquote, pre, 
abbr, acronym, address, big, cite, code, 
del, dfn, em, font, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
b, u, i, center, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td 
{ 
color: inherit; 
background-color: inherit; 
} 
h1 { 
font-size:1.5em; 
font-weight:bold; 
} 
h2 { 
font-size:1.4em; 
font-weight:bold; 
} 
h3 { 
font-size:1.3em; 
font-weight:bold; 
} 
h4 { 
font-size:1.2em; 
font-weight:bold; 
} 
h5 { 
font-size:1.1em; 
font-weight:bold; 
} 
h6 { 
font-size:1.0em; 
font-weight:bold; 
} 
img { 
border:0; 
} 
</style> 
  <meta name="GENERATOR" content="MSHTML 9.00.8112.16421" />
 </head> 
 <body scroll="no"> 
  <form id="login" method="post" action=""> 
   <h1><strong>用户登录</strong></h1> 
   <div>
    <label for="login_username"><strong>账户：</strong></label> 
    <input id="login_username" class="field required" title="请输入您的账户" name="username" /> 
   </div> 
   <div>
    <label for="login_password"><strong>密码：</strong></label> 
    <input id="login_password" class="field required" title="密码不能为空" name="password" type="password" /> 
   </div> 
   <div class="submit">
    <button type="submit" id="submit">登录</button> 
   </div>
  </form> 
 </body>
</html>
View Code

 

然后，让我们来看看效果：

 

貌似还不错的样子

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： des class style 代码 src com html log http des class style 代码 src com html log http

相关文章

随机文章

您可能还喜欢

您可能还喜欢