Using bootstrap to implement User login interface Ui_javascript skills

First to show you the effect of the picture, if you feel good, please continue to refer to the implementation of the idea of detailed.

Layout

1. The left and right halves (col-md-6)

2. Left login box occupies half of the left 10/12

3. The right is the login system considerations

HTML Elements to use

So

Input Box Group (input-group)

button (btn-success)

HTML code

<div class= "Row" style= "margin-top:30px;" > <div class= "col-md-6" style= "border-right:1px solid #ddd;" > <div class= "OK col-md-10" >  

CSS Code

. input-group{
margin:10px 0px;//input box up and down the outer margin is 10px, about 0px
}
h3{
padding:5px;
border-bottom:1px solid #ddd;//h3 font bottom Border
}
li{
list-style-type:square;//list item icon is a small square
margin:10px /Up and down outer margin is 10px
}
em{//accent style
color: #c7254e;
Font-style:inherit;
Background-color: #f9f2f4;

The above is a small series to introduce the use of bootstrap to achieve user interface UI, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!