圆角边框示例

src/app/account/login/login.component.html

@@ -7,7 +7,7 @@
       <div class="input-group-prepend">
         <span class="input-group-text">{{ 'login.manager_name' | translate }}</span>
       </div>
-      <input autocomplete="managerName" type="text" class="form-control text-center"
+      <input autocomplete="managerName" type="text" class="rect-radius form-control text-center"
              [class.is-invalid]="getValue('managerName').invalid"
              [placeholder]="'tip.input' | translate:{value:'login.manager_name'|translate}"
              formControlName="managerName">

src/app/account/login/login.component.scss

@@ -0,0 +1,5 @@
+//圆角边框
+.rect-radius {
+  border: 1px solid;
+  border-radius: 30px !important;
+}