<!doctype html>

 <html>

     <head>

     <title>EasyMall注册界面</title>

     <meta http-equiv="content-type" content="text/html" charset="utf-8">

     <link rel="stylesheet" href="D:/MyEclipse 10/day02/regit/css/regit.css">

     </head>

     <body>

     <h1>欢迎注册EasyMall</h1>

     <form action="#" method="post">

     <table>

     <tr>

         <td class="td_txt">用户名：</td>

         <td><input type="text" name="usrename"></td>

     </tr>

     <tr>

         <td class="td_txt">密码：</td>

         <td><input type="password" name="password"></td>

     </tr>

     <tr>

         <td class="td_txt">确认密码：</td>

         <td><input type="password" name="password1"></td>

     </tr>

     <tr>

         <td class="td_txt">昵称：</td>

         <td><input type="text" name="nickname"></td>

     </tr>

     <tr>

         <td class="td_txt">邮箱：</td>

         <td><input type="text" name="email"></td>

     </tr>

     <tr>

         <td class="td_txt">验证码：</td>

         <td><input class="td1" type="text" name="yzm">

         <img alt="图片加载失败" src="D:\MyEclipse 10\day02\regit\img\yzm.jpg"></td>

     </tr>

     <tr>

         <td colspan="2" class="td"><input type="submit" value="注册用户"></td>

     </tr>

     </table>

     </form>

     </body>

 </html>

 body{

     background-image: url("D:/MyEclipse 10/day02/regit/img/zc.jpg");

     background-repeat: no-repeat;

     font-family: "微软雅黑";

     background-position: top;

 }

 h1{

     text-align:center;

     margin-top: 190px;

     margin-bottom: 30px;

     color:#990000;

 }

 table{

     /*text-align:center;*/

     margin:0px auto;

 }

 table tr td.td_txt{

     text-align: right;

     font-size: 18px;

 }

 .td1{

     width:80px;

     vertical-align: middle;

 }

 .td1+img{

     vertical-align:middle;

 }

 table tr td.td{

     text-align: center;

 }

 input{

     width:150px;

     height:22px;

     border-color: #ccc;

 }

 input[type="submit"]{

     background-color:red;

     border:none;

     width:127px;

     height:44px;

     font-size: 20px;

     color:white;

     font-weight: bolder;

 }

 input[type="submit"]:hover{

     background-color:blue;

 }

 input[type="submit"]:active{

     background-color: green;

 }

 input[type="submit"]:visited{

     background-color: pink;

 }

css给html添加效果的更多相关文章

  1. 实用js+css多级树形展开效果导航菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 不可思议的纯 CSS 实现鼠标跟随效果

    直接进入正题,鼠标跟随,顾名思义,就是元素会跟随着鼠标的移动而作出相应的运动.大概类似于这样: 通常而言,CSS 负责表现,JavaScript 负责行为.而鼠标跟随这种效果属于行为,要实现通常都需要 ...

  3. 不可思议的纯 CSS 滚动进度条效果

    结论先行,如何使用 CSS 实现下述滚动条效果? 就是顶部黄色的滚动进度条,随着页面的滚动进度而变化长短. 在继续阅读下文之前,你可以先缓一缓.尝试思考一下上面的效果或者动手尝试一下,不借助 JS , ...

  4. css冻结列的效果

    <!DOCTYPE html><html lang="zh-cn"><head><meta charset="utf-8&quo ...

  5. css超出一行添加省略号属性:text-overflow和white-space

    通过使用text-overflow和white-space属性来使文本在一行内显示,超出则加省略号,添加如下html代码: <p>前端开发博客专注前端开发和技术分享,如果描述超过100像素 ...

  6. 我给女朋友讲编程CSS系列(1) –添加CSS样式的3种方式及样式表的优先权

    如果说,原生态就是美,那么,我们就没有必要穿衣打扮. 网页是什么? 说白了,网页就是一堆[html标签]有序的搭配,让[CSS属性值]整整容,请[Javascript语言]处理一下事件. 一个人的整容 ...

  7. animate.css引入实现动画效果

    最近在网上看到很多代码都通过引入animate.css来实现动画效果,后来我便使用这种方法来尝试着写了个小案例,结果真的很好用,比我们通常情况下使用css或js实现动画效果好得多,便在此做个总结. 第 ...

  8. 有趣的css—简单的下雨效果2.0版

    简单的下雨效果2.0版 前言 笔者上一篇发布的文章有趣的css-简单的下雨效果中有位老哥给我提了一个很棒的建议,大致意思是波纹应该产生于雨滴的消失处. 这是按照老哥的建议完善后的效果图: 由于我制作G ...

  9. 原生JS、CSS实现的转盘效果（目前仅支持webkit）

    这是一个原生JS.CSS实现的转盘效果(题目在这:http://www.cnblogs.com/arfeizhang/p/turntable.html),花了半个小时左右,准备睡觉,所以先贴一段代码, ...

随机推荐

  1. 通过Shell脚本将VSS项目批量创建并且提交迁移至Gitlab

    脚本运行环境:Git Bash 系统环境:Windows 10 Pro 1709 VSS版本:Microsoft Visual SourceSafe 2005 我的VSS工作目录结构如下: D:\wo ...

  2. LabVIEW中开放隐藏属性的inikey

    SuperSecretPrivateSpecialStuff=TRUE 在LabVIEW中有很多属性和方法是隐藏的,在labview安装根目录下的ini中添加该信息能开放这些隐藏的属性和方法.这时候能 ...

  3. windows 系统验证是否为正版

    博客园里边写这种帖子,足以证明我有多无聊.话不多说,上干货. 一台计算器如果没有操作系统,就是一块大的板砖,拿起来抡人太重,放地上做床又太小. 如何查看自己操作系统呢?windows7 桌面找到我的电 ...

  4. VueScroller 使用

    下载插件  npm install vue-scroller -D 引入插件: import Vue from 'vue'import VueScroller from 'vue-scroller' ...

  5. Python线程模块threading

    线程,程序执行的最小单元,单线程处理多个任务只能一个处理完后继续处理下一个直到全部处理完,多线程处理任务会比单线程处理起来快吗?在python程序里得看情况,首先有GIL锁的存在导致同一时刻只能有一个 ...

  6. Best Practices for Assembly Loading

    原文链接 This article discusses ways to avoid problems of type identity that can lead to InvalidCastExce ...

  7. Linux （麒麟）系统 重启后无法登陆进图形界面

    登录图形化界面的时候,会显示GNOME电源管理器没启动等提示信息,会一直卡在登录界面 在启动的时候按ESC或者在登录界面crtl+alt +f3 进入字符终端界面 查看物理存储空间占用信息,可能会有一 ...

  8. Ubuntu14.04+Dell 7060安装无线/有线网络驱动

    7060的有线网卡I219-LM,可以用e1000e的驱动 1.sudo mkdir -p /usr/local/src/e1000e (在/usr/local/src/中新建文件夹e1000e) s ...

  9. 工具类封装之--BaseController

    package cn.xxx.base; import cn.xxx.gecustomer.beans.GeCustomer; import cn.xxx.gecustomer.beans.GeCus ...

  10. 从scratch到python——猜数游戏

    ` 之前讲解了从scratch到python,基于python turtle库的实现,讲解了用scratch和python turtle绘图的实现,以及让小猫动起来和当角色被单击的例子. 本节课讲继续 ...