CSS some special effects settings

in CSS, the value of the box's Padding property is given in the order

padding:10px;                           Each of the four internal margins is 10px
padding:5px 10px;              Up or down 5px 10px　
padding:5px 10px 15px;             5px right 10px down 15px   left because the default is equal to right, 10px
padding:5px 10px 15px 20px;     5px right 10px Lower 15px left 20px

div horizontal and vertical centering, text-align and vertical-align do not work, because the label Div does not have these two properties, so again the CSS set these two values can not center the effect.

1. Div is centered horizontally: set margin to the left and right margin for automatic.

1 Div2 {3      margin:0 auto;4}

2. centering elements in Div

Center text in 2.1 div: sets the row height of the div to the same value as its height.

1 Div2 {3     height:200px;4     line-height:200px;5}

2.2 Div in the center of the picture, method one: the div line height set the same value as its height, the picture of the IMG jacket on the tag I, set I and div vertically centered

1 Div 2 {3     width:200px; 4     height:200px; 5     line-height:200px; 6     vertical-align:middle; 7     Backgroun D-color:gray; 8} 9 div i10 {     vertical-align:middle;12}

2.3 Div in the center of the picture, method two: the Div converted to TableCell, let the post-set Vertical-align property Center.

1 Div2 {3     width:200px;4     height:200px;5     display:table-cell;6     vertical-align:middle;7     BACKGROUND-COLOR:GRAY;8}

CSS some special effects settings