前端学习记录11-CSS-(元素隐藏，鼠标样式，轮廓线，拖拽)

元素隐藏

使用场景：
1.网站的广告 点x之后就没了
2.配合定位 有一些鼠标在物体上就显示的小窗口 (下拉菜单特效)
3.视频网站上播放视频鼠标移动上去显示一个播放按钮有个浅黑色背景覆盖在视频预览图上
4.你想咋用就咋用

display(设置或检索对象是否以及如何显示)

display:none; 隐藏对象 并且不再保留位置
display:block;在此处的作用为显示元素，block不光可以让元素转换为块级元素

visibility(可见性)

隐藏的对象 保留位置
主要在js特效中使用 页面布局最好不用 因为空出了位置

属性值	说明
inherit	继承父元素的可见性(默认属性 基础为可见)
visible	可视
hidden	隐藏
collapse	表格上隐藏行或列(此属性不常用，这东西需求相对较小)基本等同于hidden但常用于表格

overflow(溢出or滚动条)

主要使用的目的是控制盒子中存在的文字 基本不用忒难看
并且不同浏览器的滚动条不一样
可清除浮动但清除浮动最好不用这个

属性值	说明
visible	不剪切内容 不添加滚动条(默认属性)
hidden	不显示超过对象尺寸的内容 超出部分隐藏
scroll	总显示滚动条 无论内容多少 (难看)
auto	超出尺寸自动显示滚动条 不超出不显示

使用隐藏来制作网页鼠标悬停出现播放按钮效果

效果如下图：

<div class="video-links">
	<a href