当把 line-height 的高度设置和 height 高度一样就能使 文字垂直居中
margin:0 auto; 水平居中;
超出文字隐藏 overflow: hidden;/*内容超出后隐藏*/text-overflow: ellipsis;/* 超出内容显示为省略号*/white-space: nowrap;/*文本不进行换行*/ 垂直居中 html,body { width: 100%; height: 100%; margin: 0; padding: 0; } .content { width: 300px; height: 300px; background: orange; margin: 0 auto; /*水平居中*/ position: relative; top: 50%; /*偏移*/ margin-top: -150px; }