html 登录页面提示信息,登陆界面.html

西南石油大学电子邮件系统

*{ margin:0; padding:0}

body{ font-family:"微软雅黑",Verdana, Geneva, sans-serif; font-size:12px; background:#fff}

.t{ height:76px; line-height:90px; background:#f5f5f5; border-bottom:1px solid #e5ecf0; overflow:hidden;}

a{ outline:none}

.h{ width:964px; margin:0 auto;}

.logo{ padding-top:15px; float:left}

.help{ float:right; font-size:14px; font-weight:700; color:#787878; text-decoration:none;}

.help:hover{ text-decoration:underline}

.c{ width:964px; height:460px; margin:20px auto 0 auto; background:url(image/login_bg_04.jpg) no-repeat; position:relative}

.b{ height:70px; border-top:1px solid #fff; border-radius:0 0 5px 5px; background:#f7f7f7; clear:both; width:964px; margin:0 auto; text-align:center; line-height:70px; color:#999;}

ul{ list-style:none}

.box{ width:376px;position:absolute; box-shadow:0 0 5px rgba(0,0,0,0.4)}

.text_item{height:38px; line-height:38px; width:292px; margin:15px 0 30px 0;}

.text_item1 { position:relative;}

input.sms_input { width:135px; height:36px; line-height:36px;outline:none; font-size:20px;border:1px solid #c7c7c7; background:#f3f3f3; border-radius:2px; padding:0 20px 0 5px; font-family:"微软雅黑"}

.sms_login { position: absolute;right: 0;top: 0;width: 130px;background-color: #e6e6e6;text-align: center;height: 36px;cursor: pointer;color: #333;font-size: 14px;font-family: 微软雅黑;border: 1px solid #c7c7c7;}

.sms_disabled { color: #999; cursor:default; background:#dedede;}

.text{ height:36px; line-height:36px;outline:none; font-size:20px;width:280px;border:1px solid #c7c7c7; background:#f3f3f3; border-radius:2px; padding:0 5px; font-family:"微软雅黑"}

.text_f{ height:36px; line-height:36px;outline:none; font-size:20px;width:280px; padding:0 5px;border:1px solid #0167ff; background:#fff; border-radius:2px; box-shadow:0 0 3px rgba(0,0,0,0.4); font-family:"微软雅黑"}

.text_f1{ height:36px; line-height:36px;outline:none; font-size:20px;width:133px; padding:0 20px 0 5px;border:1px solid #0167ff; background:#fff; border-radius:2px; box-shadow:0 0 3px rgba(0,0,0,0.4); font-family:"微软雅黑"}

.bl{color:#999; width:292px; overflow:hidden; position:relative; top:-3px; font-size:14px;}

.bl a{ color:#999; text-decoration:none}

.bl a:hover{ color:#333; text-decoration:underline;}

.bl input{ position:relative; top:2px; opacity:0.7;}

.tab{ border-bottom:3px solid #ff7e00; border-bottom:3px solid rgba(255,126,0,0.8); overflow:hidden;}

.tab li{ height:40px; line-height:40px; float:left; width:354px; text-align:center; background:url(image/tablicurrent.png); _background:#333;color:#fff; font-size:16px; cursor:pointer;}

/*.tab li:hover{background:url(/tpl/login/user/images/tablihover.png); _background:#000; }*/

.tab li.current{background:url(image/tablicurrent.png); _background:#ff7e00;}

.tab li.dragbar{ width:22px; background:url(image/dragbar.png); cursor:move}

.boxc{ background:#fff; padding:20px 0 30px 42px;}

.pop{ border:1px solid #0167ff; position:absolute; width:290px; background:#fff; border-top:none;z-index:100; border-radius:0 0 2px 2px; box-shadow:0 2px 3px rgba(0,0,0,0.4); left:42px; top:136px; z-index:1000}

.pop a{ overflow:hidden;display:block; height:34px; line-height:34px; font-size:14px; color:#666; margin:0 5px; font-weight:700; text-decoration:none;}

.pop p:hover{ background:#f6f6f6}

.pop p:first-child a{ border-top:1px dotted #eee;}

.pop p.first{ color:#000; background:#b5c6e6;}

.fp{ position:absolute; right:0; top:-14px; line-height:12px; text-decoration:none; color:#333}

.fp:hover{ text-decoration:underlined; color:#333}

.yzm{ float:right; display:block; height:38px; background:#eee; width:135px;}

.yzmbox{ position:absolute; height:38px; width:112px; background:#eee; left:000; top:-40px;}

a.zc{ font-weight:700; color:#f60}

a.zc:hover{color:#f60}

.showpassword{ position:absolute; height:18px; line-height:18px; right:-1px; top:38px; background:#bac5d4; color:#fff; padding:0 3px;}

.showpassword input{ position:relative; top:2px;}

.btnb{margin:20px 0 0 0; width:292px; position:relative;}

.btnb a{ float:right; color:#787878; text-decoration:none;}

.btnb a:hover{ text-decoration:underline;}

.btn{ height:38px; width:142px; border:none; font-size:14px; color:#fff; font-weight:400; background:url(image/login_btn.jpg) 0 0; font-size:20px; font-family:"微软雅黑"}

.btn:hover{ background-position:0 -38px;}

h3{ text-align:; font-size:16px; padding-right:10px; }

.blt{ float:right;}

.msg{ position:absolute; background:#cc3300; color:#fff; padding:0 10px; font-size:14px; top:55px; height:30px; line-height:30px; left:42px; right:42px; text-align:center}

.f{ position:absolute;bottom:56px;background:url(image/wbg.png); _background:#fff;height:80px; padding:10px;}

.fl{ float:left; height:80px; width:80px; margin-right:10px;}

.fr{ float:left; height:80px; width:320px; padding-left:10px;}

.fr a{ line-height:20px; display:block; width:320px; overflow:hidden; height:20px; color:#333; text-decoration:none; background:url(/tpl/login/user/images/login_dot.jpg) left center no-repeat; padding-left:5px;}

.login_drag{ display:none; position:absolute; width:374px; height:342px; top:60px; left:60px; border:1px dotted #000; zoom:1; background:url(image/dragbg.png); _background:none;}

h3 a{ float:right; font-size:12px; font-weight:400; line-height:22px; color:#f60; text-decoration:none;padding-right:10px;}

.ewmpic{position:relative;height:120px; width:120px; padding:5px; border:1px solid #eee; background:#fff; margin:20px 0 0 75px; margin-bottom:10px;}

.ewmpic img{ width:120px; height:120px;}

.led{ padding:20px 0 0 75px; font-size:14px; font-weight:400; color:#666}

.ledp{ width:200px; background:#eee; height:25px; line-height:25px; text-align:center; border-radius:13px; margin-left:45px;}

.exp {position:absolute;padding-top:45px;left:0px;right:0px;top:0px;bottom:0px;background:rgba(0,0,0,0.5);color:#fff;line-height:190%;text-align:center;}

.pushbox{ height:344px; width:400px; position:absolute; z-index:10}

b.epicon{ display:block; height:43px; width:43px; background:url(/tpl/login/user/images/ep_icon.png) no-repeat; cursor:pointer}

b.epicon:hover{ background-position:0 -43px;}

.epush{ padding-top:70px;}

.epic{ float:left;}

.dtab{ height:22px; padding-bottom:1px; background:url(/tpl/login/user/images/t50w.png) repeat-x 0 22px; margin-top:25px;}

.dtab a{ display:block; float:left; margin-right:10px; height:22px; line-height:22px; padding:0 15px; text-decoration:none; color:#fff; text-shadow:0 1px 1px rgba(0,0,0,0.5)}

.dtab a.current{ background:url(/tpl/login/user/images/t50w.png); border-radius:3px 3px 0 0; box-shadow:1px -1px 1px rgba(0,0,0,0.2)}

.dbox > div{ display:block; float:left; margin:15px 15px 0px 0; height:25px; line-height:25px;padding:0 20px; border-radius:2px; text-decoration:none; color:#fff; cursor:pointer}

.dbox > div > a{ color:#fff; text-decoration:none;}

.d_desk{ background:url(/tpl/login/user/images/dbg.png) 0 0 repeat-x;}

.d_stor{ background:url(/tpl/login/user/images/dbg.png) 0 -25px repeat-x;}

.d_code{ background:url(/tpl/login/user/images/dbg.png) 0 -50px repeat-x; position:relative}

.dbox > div:hover{ box-shadow:0 0 3px rgba(0,0,0,0.5)}

.divcode{ position:absolute; width:122px; left:12px; display:none;}

.arrt{ position:absolute; left:55px; top:0; background:url(/tpl/login/user/images/arrt.png);width:13px; height:7px; z-index:7}

.codec{ background:#fff; width:120px;position:absolute; top:6px; z-index:5; border:1px solid #dadada; border-radius:3px; box-shadow:2px 2px 2px rgba(0,0,0,0.3)}

.codec p{ color:#666; padding:5px 10px 0; line-height:160%; width:100px;}

.ewm{ padding:5px 10px 10px 10px;}

.ewm img{ width:100px;}

.d_code:hover .divcode{ display:block;}

.ep h2{ font-size:34px; font-weight:400; color:#fff; text-shadow:0 1px 1px #3e240a;}

.ep h3{ font-size:22px; color:#fff; font-weight:400; text-shadow:0 1px 1px #3e240a; padding-top:10px;}

.dbox > div{ padding:0; width:150px; text-align:center}

function check(){

if($("#pw").val()==""||$("#user").val()=="")

{alert ("请将用户名与密码填写完整");}

else if($("#user").val()=="tom"&&$("#pw").val()=="123")

{window.location="www.baidu.com"}

return false;

}

  • 帐号登录

用户登录

学生选择@stu.swpu.edu.cn

忘记密码

西南石油大学

一键复制

编辑

Web IDE

原始数据

按行查看

历史

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 单片机不适合直接实现复杂的HTML登录界面。单片机是一种嵌入式微型计算机,主要用于控制类应用,资源有限,没有成熟的操作系统、图形界面等支持。因此,实现一个完整的HTML登录界面对于单片机来说是相当困难的。 然而,可以通过单片机与外部设备(如显示屏、键盘、按钮等)的配合,间接实现简单的登录功能。例如,使用单片机控制一个小型LCD显示屏,用来展示登录界面(包括账号输入框、密码输入框、登录按钮等),并通过键盘或按键输入账号密码。单片机可以通过串口通信或者自定义的通信协议,将输入的账号密码发送给外部的服务器或其他计算设备进行验证,并根据验证结果,在显示屏上显示相应的登录成功或失败信息。 虽然这种方式不能像在计算机上直接使用HTML那样自由灵活,但对于一些简单的控制应用来说足够了。如果需要更加复杂的登录界面,建议使用运算能力更强大的计算设备(如单片机外的计算机或嵌入式系统)来处理HTML界面,单片机只负责与外部设备的通信和控制即可。 ### 回答2: 单片机是一种集成了处理器、内存和各种输入输出接口的微型电脑。它通常被用于各种控制系统中,可以实现各种功能。 想要在单片机上实现一个HTML登录界面,首先需要了解HTML和单片机的基本知识。 HTML是一种用于创建网页的标记语言,通过使用HTML标签和属性,可以实现网页的结构和样式。 在单片机上实现HTML界面,可以考虑以下步骤: 1. 确定单片机的显示屏幕类型:单片机可以连接各种不同类型的显示屏幕,如LCD液晶屏、LED数码管、OLED屏幕等。选择适合的显示屏幕类型,以便在上面显示HTML界面。 2. 学习HTML基本语法:了解HTML标签和属性的使用方法,例如掌握标题标签、段落标签、文本输入标签、按钮标签等。这些标签可以用来创建登录页面所需的元素。 3. 利用单片机编程语言实现HTML界面:使用单片机编程语言,如C语言或汇编语言,通过对单片机的编程来实现HTML界面的显示和交互。可以利用单片机提供的GPIO接口控制显示屏幕,并通过串口或者以太网接口进行与外界的通信。 4. 设计登录功能:在HTML界面中添加用户名输入框、密码输入框和登录按钮,并通过单片机编程实现输入框的数据获取和按钮的点击事件处理。可以使用单片机的存储功能,将用户名和密码保存在内存中,并与用户输入的数据进行匹配,以实现登录功能。 5. 测试和调试:完成代码编写后,进行测试和调试。检查界面的显示是否正确,登录功能是否正常。根据需求进行修改和优化,直到满足要求。 总之,要在单片机上实现HTML登录界面,需要掌握HTML基本语法和单片机编程相关知识,并通过编程实现界面显示和交互功能。这样可以实现一个简单的登录界面,并能够接收用户输入的数据进行处理。 ### 回答3: 单片机是一种集成电路,可以用于控制电子设备。HTML是一种标记语言,用于创建网页。如何在单片机上实现HTML登录界面呢? 首先,我们需要将单片机连接到网络,以便可以访问网页。可以通过串口或者以太网接口连接单片机到计算机或者路由器。接下来,我们需要编写代码来创建登录界面。 在HTML中,我们可以使用<form>元素来创建登录表单。表单中通常包含输入框和提交按钮。通过在输入框中输入用户名和密码,用户可以提交表单以进行登录。 在单片机上,我们可以使用C语言或者其他支持HTML的语言来编写代码。首先,我们需要将HTML代码嵌入到C语言代码中。然后,我们可以使用单片机的输入输出功能来实现用户输入和登录验证。 具体实现过程如下:首先,我们需要使用单片机的输入功能来获取用户输入的用户名和密码。然后,我们可以使用C语言的字符串处理函数来处理用户输入的数据。接下来,我们可以使用逻辑判断语句来验证用户名和密码是否正确。如果验证成功,可以跳转到登录成功页面;如果验证失败,可以显示错误提示信息。 在单片机上,由于资源有限,可能无法支持复杂的HTML样式和交互效果。但是我们仍然可以使用一些基本的HTML元素和样式来创建简单的登录界面。 总之,实现在单片机上的HTML登录界面需要将单片机连接到网络,并在代码中嵌入HTML代码。然后使用单片机的输入输出功能和相应的编程语言来处理用户输入和登录验证。虽然由于单片机资源限制,无法实现复杂的界面效果,但我们可以通过简单的HTML元素和样式,创造一个基本的登录界面。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值