1.居中：

  <div style={{ display: 'flex', justifyContent: "center", alignItems: "center" }} >

2.一边居左一边居右

<div style="width:1000px;">
<p style="width:500px;float:left;">Left txt</p>
<p style="width:500px;float:right;">Right txt</p>
</div>

3.绝对定位到底部

 <div style={{ position: "fixed", bottom: "0", width: '100%' }}>
                    <Button
                        type="primary"
                        onClick={() => { this.onClick() }}

                    >保存</Button>
                </div>

4.改变颜色透明度：

 background-color:rgba(144, 165, 201, 0.3)

5.修改input点击后的边框

<Input bordered={false} className="login-input"   placeholder="Username"  />

 .login-input:focus{
        outline:none;
        border:  rgba(144, 165, 201, 0.5);
    }

6.将框变成圆角

 border-radius: 8px;

7.改变输入框inpu的默认字体颜色大小

<Input  className="login-input"   placeholder="Username"  />

.login-input::-webkit-input-placeholder{
    color:#fcf8f8;
    font-size:20px;
    }

7.改变按钮Button的默认字体颜色大小

  -webkit-text-fill-color: #fff;
    font-size:17px;

8.添加带有边框的圆形头像

   <div className="login-img1">
 <img className="login-img" src={headportrait}></img>
 </div>

.login-img{
    width:100px;
    height:100px;
    border-radius:100px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -50px;
    margin-top: -50px;
}
.login-img1{
    width: 105px;
    height: 105px;
    border-radius: 100px;
    background-color: white;
    position: relative;
   
  
}

待更新…