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

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样式(文字超出部分用省略号显示、鼠标经过图片放大、出现阴影)的更多相关文章

  1. html使用css让文字超出部分用省略号三个点显示的方法案例

    html使用css让文字超出部分用省略号三个点显示的方法: 我正确使用的就是下面的代码,li里面是a标记.在IE和google中使用是正常的,火狐不知道,我也不在意,等你来测 li{ display: ...

  2. 11种常用css样式学习大结局滚动条与显示隐藏

    滚动条展示 overflow-x: hidden;/*是否对内容的左/右边缘进行裁剪*/overflow-y: hidden;/*是否对内容的上/下边缘进行裁剪*/overflow:scroll;/* ...

  3. Css解决表格超出部分用省略号显示

    小伙伴们有没有的遇到页面显示时,因为数据太长导致显示的表格某一列过长,从而导致页面的不美观,下面我们来看一看如何用Css样式解决表格超出部分用省略号显示的问题. 主要设置两个样式: table{ ta ...

  4. CSS样式-文字超出宽部分用省略号代替

    .name {text-overflow: ellipsis;white-space: nowrap;overflow: hidden;display:block;width:120px;    }

  5. 【css】文本超出行数以省略号显示

    //超出2行省略overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webk ...

  6. 11种常用css样式之鼠标、列表和尺寸样式学习

    鼠标cursor常见样式crosshair;/*十字形状*/cursor:pointer;/*小手形状*/cursor:wait;/*等待形状*/cursor:text;/*默认 文本形状*/curs ...

  7. 11种常用css样式之background学习

    background如何简写?如何在背景图像不变的情况下,依旧实现页面文字滚动,为之奈何?别担心,快用background-attachment: fixed;/*固定定位*/常用的backgroun ...

  8. 获取jQuery对象的第N个DOM元素 && table常用css样式

    获取jQuery对象的第N个DOM元素 1.$(selector).get(N-1) 2.$(selector)[N-1] 注意:.index()方法返回的是一个数,相当于C#中的IndexOf() ...

  9. 11种常用css样式之表格和定位样式学习

    table表格中border-collapse: collapse;/*表格边框是否合并*/border-spacing: 10px;/*表格边框之间的距离*/定位详情可以阅读position属性值4 ...

随机推荐

  1. 前端-Vue基础2

    1.过滤器 前台通过后台传值,要对后台传过来的变量进行特殊处理,比如根据id转成中文等: 1.1 局部过滤器 局部过滤器只针对一个Vue实例 默认将|左侧count传递给右侧方法 {{count|fi ...

  2. asp.net c#整理所有本地的图片一次性保存到SQL表中

    string sql1 = "select distinct tx from tiku where tx is not null"; //检索tx表中所有的不重复的tx值 stri ...

  3. Java基础00-修饰符18

    1. 包 1.1 包的概述和使用 通过记事本的方法 package com.itheima;public class HelloWorld { public static void main(Stri ...

  4. 【路径规划】 Optimal Trajectory Generation for Dynamic Street Scenarios in a Frenet Frame (附python代码实例)

    参考与前言 2010年,论文 Optimal Trajectory Generation for Dynamic Street Scenarios in a Frenet Frame 地址:https ...

  5. 测试笔记01-Git

    Git工具 Git 一个分布式版本管理工具, 学习资料: https://www.liaoxuefeng.com/wiki/896043488029600/1317161920364578 其中:解决 ...

  6. AI开发者十问:10分钟了解AI开发的基本过程

    摘要:从AI开发模型.框架.工具,到提升开发效率的学习办法,为AI开发者逐一解答. 本文分享自华为云社区<10分钟了解AI开发的基本过程>,作者:简单坚持. 1.AI开发究竟在开发什么? ...

  7. linux系统安装+windows系统安装

    linux 1.格式化U盘 打开管理员命令提示符 diskpart list disk select disk 2 clean create partition primary format fs=f ...

  8. protobuf基础类以及python 转换pb2.py文件

    一 protobuf-前端解析js 前端解析思路: 1.问后端要数据模型文件,比如名为MODEL.proto 2.使用谷歌官方的工具生成MODEL.js 3.把项目中引用的MODEL.js 和谷歌官方 ...

  9. Python 接口之request ,headers格式不对

    复制heardes格式,模拟请求报错 原因:粗心,headers带了空格

  10. 如何获取SQL Server数据库连接字符串的某些部分

    有的时候需要获取SQL Server数据库连接字符串的某些部分.用正则表达式可能有点麻烦. 其实有一个比较简单的方法--使用SqlConnectionStringBuilder. var builde ...