Reg.html 2.5 KB
Newer Older
qq_53854309's avatar
qq_53854309 已提交
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<style>
    *{
        margin: 0;
        padding: 0;
    }
    body{
        display: flex;
        justify-content: center;;
    }
    #app{
        margin: 30px;
        padding: 50px;
        width: 300px;
        box-shadow: 0px 1px 3px   grey,
        0px -1px 3px   grey,
        1px 0px 3px   grey,
        -1px 0px 3px   grey;
    }
    .efi{
        padding: 0px !important;
    }
    #btn{
        width: 300px;
    }
</style>
</head>
<body>
    <div id="app">
        <div style="text-align: center;"><h2>Register With Us</h2></div>
        <br>
        <el-form ref="form" :model="form" label-width="80px"  label-position="top" >
            
            <el-form-item>
                <label class="el-form-item__label efi"  >Username</label>
              <el-input v-model="form.name" placeholder="Enter username"></el-input>
            </el-form-item>
            <el-form-item>
                <label class="el-form-item__label efi"  >Email</label>
                <el-input v-model="form.name" placeholder="Enter email"></el-input>
            </el-form-item>
            <el-form-item>
                <label class="el-form-item__label efi"  >Password</label>
                <el-input v-model="form.name" placeholder="Enter password"></el-input>
            </el-form-item>
            <el-form-item>
                <label class="el-form-item__label efi"  >Confirm Password</label>
                <el-input v-model="form.name" placeholder="Enter password again"></el-input>
            </el-form-item>
            <el-button type="primary" id="btn">Submit</el-button>
          </el-form>
    </div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.1/dist/vue.js"></script>
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
    new Vue({
  el: '#app',
  data() {
      return {
        form: {
          name: '',
          region: '',
          date1: '',
          date2: '',
          delivery: false,
          type: [],
          resource: '',
          desc: ''
        }
      }
    },
    methods: {
      onSubmit() {
        console.log('submit!');
      }
    }
});

</script>

</html>