CSS知识

CSS知识

标签(空格分隔): CSS布局


图片垂直居中于元素


* {
    box-sizing: border-box;
}

.content {
    display: table;
    border: 1px solid #06c;
    padding: 15px 5px;
    max-width: 1000px;
    margin: 10px auto;
    min-width: 320px;
    width: 100%;
}
.img-box{
    height: 150px;
    width: 100px;
    border:1px solid red;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    background-color:#4679bd;
}



![logo](http://upload-images.jianshu.io/upload_images/1785100-11efb98a1c40d424.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

外部使用display:table;内部使用display:table-cell;vertical-align:middle;让图片居中

css实现文字超出后,省略号

1.overflow:hidden;
2.text-overflow:ellipsis;
3.-o-text-overflow:ellipsis;
4.white-space:nowrap;
5.width:100%;

你可能感兴趣的:(CSS知识)