首页 > 代码库 > css一些特别效果设定

css一些特别效果设定

2024-08-11 00:40:37   219人阅读

在CSS中，BOX的Padding属性的数值赋予顺序为

 

padding:10px;                           四个内边距都是10px
padding:5px 10px;   　              上下5px　左右10px
padding:5px 10px 15px;             上5px　右10px　下15px   左因为缺省与右相等，则为10px
padding:5px 10px 15px 20px;     上5px　右10px　下15px 　左20px



div水平和垂直居中，text-align和vertical-align不起作用，因为标签div没有这两个属性，所以再css中设置这两个值不能居中的效果。

1. div水平居中:设置margin的左右边距为自动。

1 div2 {3      margin:0 auto;4 }

2.   div中的元素居中

2.1 div中的文字居中：将div的行高设置跟其高度一样的值。

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

2.2 div中的图片居中,方法一：将div的行高设置跟其高度一样的值，将其中的图片img外套上标签i,设置i和div同时垂直居中

 1 div 2 { 3     width: 200px; 4     height: 200px; 5     line-height: 200px; 6     vertical-align: middle; 7     background-color: Gray; 8 } 9 div i10 {11     vertical-align: middle;12 }

2.3 div中的图片居中,方法二：将div转换成tablecell,让后设置vertical-align属性居中。

1 div2 {3     width: 200px;4     height: 200px;5     display: table-cell;6     vertical-align: middle;7     background-color: Gray;8 }
 
 

css一些特别效果设定


联系
我们