码迷,mamicode.com
首页 > Web开发 > 详细

常用css样式(文字超出部分用省略号显示、鼠标经过图片放大、出现阴影)

时间:2018-11-10 12:48:35      阅读:235      评论:0      收藏:0      [点我收藏+]

标签:部分   dde   radius   white   space   lips   psi   样式   webkit   

文字超出部分用省略号显示:

white-space: nowrap; /* 不换行 */
overflow: hidden; /* 超出部分不显示 */
text-overflow: ellipsis; /* 超出部分显示为... */

鼠标经过图片放大

.team-img img{
width:188px;
height: 200px;
border-radius: 50%;
transition: all 1.2s;
-moz-transition: all 1.2s;
-webkit-transition: all 1.2s;
-o-transition: all 1.2s;
}
.team-img img:hover{
transform: scale(1.2);
-moz-transform: scale(1.2);
-webkit-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
}

鼠标经过,div出现阴影

.team-item{
background: #fff;
border-radius: 7px;
transition: all .3s linear;
}
.team-item:hover{ 
transition: .3s all;
box-shadow: 0px 6px 17px #888888;
}

常用css样式(文字超出部分用省略号显示、鼠标经过图片放大、出现阴影)

标签:部分   dde   radius   white   space   lips   psi   样式   webkit   

原文地址:https://www.cnblogs.com/vientiane/p/9938582.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!