html 当时做到的就是这些了

  1. <!DOCTYPE html>
    <html lang="en">
    <head>
        <title>病人信息查询系统</title>
        <meta charset="UTF-8">
        <link href="css/style.css" rel="stylesheet" type="text/css">
    </head>
    <body>
  2.  
  3.    <div class="logo">
          <img src="data:images/6.jpg"/>
          </div>
       <div class="sign">
              <h6>桂航医院</h6>
              </div>
  4.  
  5.    <div class="header">
              <h1>病人查询</h1>    
       </div>
  6.  
  7. <div class="padding-all">
        <div class="design-w3l">
            <div class="mail-form-agile">
  8.  
  9.                 <input type="text" name="text" placeholder="输入病人姓名"/>
                    <br>
                    <br>
                 <input type="text" name="text" placeholder="输入病人身份证号"/>
                 <br>
                 <br>
                 <input type="text" name="text" placeholder="输入病人预留手机号"/>
                 <br>
                 <br>
                 <llm>获取验证码</llm>
                 <input type="text" name="text" placeholder="验证信息是："/>
                    <input type="submit" value="查询">
  10.  
  11.         </div>
            <div class="clear"> </div>
        </div>
    </div>
    </body>
    </html>
    css
  1. html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
    article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
    ol,ul{list-style:none;margin:0px;padding:0px;}
    blockquote,q{quotes:none;}
    blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
    table{border-collapse:collapse;border-spacing:0;}
    /* start editing from here */
    a{text-decoration:none;}
    .txt-rt{text-align:right;}/* text align right */
    .txt-lt{text-align:left;}/* text align left */
    .txt-center{text-align:center;}/* text align center */
    .float-rt{float:right;}/* float right */
    .float-lt{float:left;}/* float left */
    .clear{clear:both;}/* clear float */
    .pos-relative{position:relative;}/* Position Relative */
    .pos-absolute{position:absolute;}/* Position Absolute */
    .vertical-base{    vertical-align:baseline;}/* vertical align baseline */
    .vertical-top{ vertical-align:top;}/* vertical align top */
    nav.vertical ul li{    display:block;}/* vertical menu */
    nav.horizontal ul li{  display: inline-block;}/* horizontal menu */
    img{max-width:100%;}
    /*end reset*/
    /****-----start-body----****/
  2.  
  3. body{
    text-align: center;
    background: url(../站点/66.jpg)0px no-repeat;
    background-size:cover;
    background-attachment: fixed;
    }
  4.  
  5. @font-face{
    font-family: "Audiowide-Regular";
    src:url(../fonts/Audiowide-Regular.ttf);
    }
    @font-face{
    font-family: "Asap-Regular";
    src:url(../fonts/Asap-Regular.ttf);
    }
    .sign {
    text-align: center;
    padding-bottom:75px;
    }
    .sign h6 img{
    width:7%;
    }
    .sign h6{
        width: 50px;
        height: 0px;
        border-left-width: 20px;
        padding-left: 8px;
       font-size: 30px;
       color:rgba(0,0,0,1.00);
       font-family:"aguafina-script";
       letter-spacing:3px;
        margin-top: 0px;
    }
     .logo{
       max-width: 6%;
       padding-left:0px;
    }
    .padding-all{
  6.  
  7.     padding-left: 100px;
        padding-right: 100px;
        padding-top: 5px;
        padding-bottom: 200px;
  8.  
  9. }
  10.  
  11. .header {
    text-align: center;
    padding-bottom:75px;
    }
    .header h1 img{
        top: 40px;
        width: 400px;
        height: 50px;
    }
  12.  
  13. p ,a{
    font-family: "Asap-Regular";
    }
  14.  
  15. .header h1 {
    font-size:50px;
    color:rgba(18,49,103,1.00);
    font-family: "Audiowide-Regular";
    letter-spacing:3px;
    margin:0 auto;
    }
  16.  
  17. .design-w3l{
    width:36%;
    margin:0 auto;
    }
  18.  
  19. .mail-form-agile {
        padding: 50px 40px;
        text-align: center;
        margin:0px;
        background: rgba(23, 218, 218, 0.18);
        color: #000;
       margin:0 auto;
    }
  20.  
  21. .padding {
    margin: 5px 0 30px;
    }
  22.  
  23. .LoginPadding {
        margin: 20px 0 30px;
    }
    .mail-form-agile llm{
       display:inline-block;
       width:40%;
       background-color: dodgerblue;
       padding: 13px 10px;
       text-align: left;
  24.  
  25. }
    .mail-form-agile llm:hover{
       background: rgba(221,36,36,1.00);
       font-size:large;
       color:rgba(96,85,85,1.00);
    }
  26.  
  27. .mail-form-agile input[type="text"], .mail-form-agile input[type="password"] {
    padding: 13px 10px;
    width: 92.5%;
    font-size: 16px;
    outline: none;
    background:transparent;
    border:0px;
    border-bottom: 1px solid rgba(110,19,224,1.00);
    border-radius: 0px;
    font-family: "Asap-Regular";
    letter-spacing:1.6px;
    color:rgba(49,46,69,1.00);
    }
    ::-webkit-input-placeholder{
       color:#b4b0b0 !important;
       font-weight:400;
    }
    .mail-form-agile input[type="submit"]{
    font-size: 18px;
    padding: 10px 20px;
    letter-spacing:1.2px;
    border: none;
    text-transform: capitalize;
    outline: none;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    background: #D65B88;
    color: #fff;
    cursor: pointer;
    margin: 0 auto;
    font-family: "Asap-Regular";
    -webkit-transition-duration: 0.9s;
    transition-duration: 0.9s;
    }
  28.  
  29. .mail-form-agile input[type="submit"]:hover {
     -webkit-transition-duration: 0.9s;
     transition-duration: 0.9s;
     background:rgba(91, 157, 214, 0.76);
    }
  30.  
  31. .mail-form-agile div{
        display: inline;
        font-size: 18px;
        padding: 11px 20px;
        letter-spacing:1.2px;
        border: none;
        text-transform: capitalize;
        outline: none;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        background: #D65B88;
        color: #fff;
        cursor: pointer;
        margin: 0 auto;
        font-family: "Asap-Regular";
        -webkit-transition-duration: 0.9s;
        transition-duration: 0.9s;
    }
  32.  
  33. .mail-form-agile div:hover {
        -webkit-transition-duration: 0.9s;
        transition-duration: 0.9s;
        background:rgba(91, 157, 214, 0.76);
    }
  34.  
  35. .footer{
    text-align: center;
    padding-top:75px;
    letter-spacing:1.6px;
    line-height:22px;
    }
    .footer p {
    font-size: 16px;
    color: #fff;
    margin: 0px;
    letter-spacing:1.4px;
    }
    .footer p a {
    color:#D65B88;
    font-weight:blod;
    -webkit-transition-duration: 0.8s;
    transition-duration: 0.8s;
    }
    .footer p a:hover {
    color: #51cbe1;
     -webkit-transition-duration: 0.8s;
     transition-duration: 0.8s;
    }
    使用的框架
    里面很多的东西我是过了两个多月才搞懂  现在让写一个网页  也是只会用  html  和css  写一个上拉下拉  hover   和字体改变
    使用一些框架正在慢慢学习  我会找出我之前 css 和html的学习笔记  来记录的学习生活
  36.  
  1.  

hospital：广西大学生计算机设计大赛的更多相关文章

  1. 3I工作室的成员在2013年(第6届）中国大学生计算机设计大赛总决赛中荣获全国二等奖

    在暑假举行的2013年(第6届)中国大学生计算机设计大赛中,我院的参赛作品<毕业生论文选导系统>(作者:祝丽艳/许明涛:指导老师:元昌安/彭昱忠)入围总决赛,并荣获全国二等奖. 2013年 ...

  2. csu 1503: 点弧之间的距离-湖南省第十届大学生计算机程序设计大赛

    这是--比量p并用交点连接中心不上弧.在于:它至p距离.是不是p与端点之间的最短距离 #include<iostream> #include<map> #include< ...

  3. 2017年中国大学生程序设计竞赛-中南地区赛暨第八届湘潭市大学生计算机程序设计大赛题解&源码(A.高斯消元，D,模拟，E,前缀和，F,LCS，H,Prim算法，I,胡搞，J,树状数组)

    A------------------------------------------------------------------------------------ 题目链接:http://20 ...

  4. 2014年TI杯大学生电子设计竞赛地区赛使用仪器及器件、设备

     2014年TI杯大学生电子设计竞赛地区赛使用仪器及器件.设备 a)        3A/30V双路稳压电源(可并联): b)        60MHz示波器: c)        三位半数字万用 ...

  5. 2017年全国大学生物联网设计竞赛（TI杯）华东分赛区决赛总结

    全国大学生物联网设计竞赛(TI杯)是由教育部高等学校计算机类教学指导委员会主办.上海交通大学电子信息与电气工程学院承办.德州仪器半导体技术公司(TI)协办的赛事,自2014年设立以来,一直是物联网领域 ...

  6. 2016年湖南省第十二届大学生计算机程序设计竞赛---Parenthesis（线段树求区间最值）

    原题链接 http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1809 Description Bobo has a balanced parenthes ...

  7. Mockplus设计大赛获奖选手专访 | High音：轻松生活，随心嗨音

    "看似低调,实则高调的设计,UI设计是用了功力,主页功能和内容一览无余,方便用户选择,金字黑底,给予用户极好的奢华体验.原来听歌也是一种视觉享受.创新性源于对听歌氛围的把握,大幅的图片,刺激 ...

  8. 摹客 · Veer 第二届设计大赛邀你来战！

    2018年12月,摹客设计大赛一年一度一归来. 继2017年摹客全国首届原型设计大赛成功举办后,本次大赛是摹客第二届设计大赛.大赛由摹客主办,Veer独家冠名赞助,iSlide和创客贴协办,国内多家知 ...

  9. Mockplus设计大赛获奖选手专访 | Intimate：你的专属密友音乐播放器

    “Intimate中文意思是密友,就是想让这个音乐APP成为最懂用户的一款软件.” 如果,你随身听的音乐APP,可以成为知你懂你的密友,你幸福,她清唱一首<小幸运>:你悲伤,她低声浅吟&l ...

随机推荐

  1. CSPS模拟 85

    WWB大佬的bitset映射真是太强了! %%% T1 观察样例,猜规律. T2 对题目的翻译工作用了很长时间 翻译错了好几次.. 观察到奇环没法染色,选的边必须把奇环弄断 如果在偶环上,偶环就变得没 ...

  2. Spring MVC-------文件上传，单文件，多文件，文件下载

    Spring MVC 框架的文件上传是基于 commons-fileupload 组件的文件上传,只不过 Spring MVC 框架在原有文件上传组件上做了进一步封装,简化了文件上传的代码实现,取消了 ...

  3. js创建子节点

    <!DOCTYPE html><html>    <head>        <meta charset="UTF-8">      ...

  4. Matlab 在线使用 | 推荐

    Matlab 在线使用 | 推荐    

  5. html5 微信真机调试方法vConsole

    html5 微信真机调试方法 vConsolehttps://blog.csdn.net/weixin_36934930/article/details/79870240

  6. 通过C/C++,实现一元一次方程求解

    通过C/C++,实现一元一次方程求解: #include <bits/stdc++.h> using namespace std; string str, str_l, str_r; st ...

  7. pug参考文档

    1. API express框架的渲染模板有多种选择,官方的例子是Pug,网上找了一下,Pug没有可以参考的中文文档,于是自己动手丰衣足食.翻译水平一般,各位凑合着看吧. 1.1 开始 安装 通过np ...

  8. 更改input标签的placeholder的样式

    主要是要区别不同浏览器的不同css类 在input框中有时想将输入的字和placeholder设为不同的颜色或其它效果,这时就可以用以下代码来对placeholder进行样式设置了. input::- ...

  9. ubuntu 16.04上源码编译opengv | compile opengv on ubuntu 16.04

    本文首发于个人博客https://kezunlin.me/post/1e5d14ee/,欢迎阅读! compile opengv on ubuntu 16.04 Series compile open ...

  10. 从无到有实现搭建vue+ElementUI+less+ES6的开发环境并进行简单的开发的项目

    项目简介:该项目是基于日常计算宿舍水电煤气费的需求写的,旨在从无到有实现搭建vue+ElementUI+less+ES6的开发环境并进行简单的开发,使用webpack进行代码的编译.压缩和打包,并疏通 ...