标签：显示 技巧 精灵 滚动条 超出 一些 overflow 隐藏 css
1. 元素的显示与隐藏
1.1 display *
display: none; 隐藏元素
display: block; 显示元素
注: 隐藏以后, 原位置不再保留
实际开发场景：
配合js做特效，比如下拉菜单，原先没有，鼠标经过，显示下拉菜单， 应用极为广泛
1.2 visibility
visibility：visible; 可见
visibility：hidden; 隐藏
注: 隐藏之后，继续保留原有位置
1.3 overflow *
检查或设置当盒子的内容超过其指定高度及宽度时如何管理内容
overflow: 属性值;
| 属性值 | 描述 |
|---|---|
| visible | 元素默认, 不剪切内容也不添加滚动条 |
| hidden | 不显示超过对象尺寸的内容，超出的部分隐藏掉 |
| scroll | 不管超出内容否，总是显示滚动条 |
| auto | 超出自动显示滚动条，不超出不显示滚动条 |
实际开发场景：
- 清除浮动
- 隐藏超出内容，隐藏掉, 不允许内容超过父盒子
2. 鼠标样式
cursor: pointer;
| 属性值 | 描述 |
|---|---|
| default | 小白 默认 |
| pointer | 小手 |
| move | 移动 |
| text | 文本 |
| not-allowed |
3. 轮廓线 outline
是绘制于元素周围的一条线，位于边框边缘的外围, 当点击该元素时会显示
但是我们一般会把轮廓线qudiao
outline: 0;
4. 文本域进制拖拽
resize: none;
5. 文字溢出用省略号显示 *
/*1. 先强制一行内显示文本*/
white-space: nowrap;
/*2. 超出的部分隐藏*/
overflow: hidden;
/*3. 文字用省略号替代超出的部分*/
text-overflow: ellipsis; ellipsis: 省略号
6. 精灵图 *
为了有效地减少服务器接受和发送请求的次数, 提高页面的加载速度
css精灵计数其实是将网页中的一些背景图整合到一张大图中 (精灵图) , 然后, 各个网页通常只需要精灵图中不同位置的某个小图, 只需要定位到精灵图中的某个小图即可
- 背景定位基本为负值
background: url() x y;
主要思想就是利用 background-position 将需要的小图的位置摆出来
标签：显示,技巧,精灵,滚动条,超出,一些,overflow,隐藏,css 来源： https://www.cnblogs.com/zhimao/p/15066807.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。