从定义上看z-index真的是个很简单的属性，就是描述元素的层叠顺序，但是有时间我们会发现z-index并不会起作用。这时候我们就需要好好的理解一下z-index背后的问题。 我们多知道position的默认值为static,z-index的默认值为auto。当我们抛开posi…

css有些属性容易忘记，半天不写就要去查api，有时候api还不好使，于是还是记下来以后方便用，后续会慢慢补充进来的。 可以通过input, blur事件来监听element的输入和输入完后鼠标离开。 手机video 都可以在页面中播放，而不是全屏播放了。 使用clearfix…

寻根溯源话布局 一切都始于这样一个问题：怎样通过 CSS 简单而优雅的实现水平、垂直同时居中。记得刚开始学习 CSS 的时候，看到 float 属性不由得感觉眼前一亮，顺理成章的联想到 Word 文档排版中用到的的左对齐、右对齐和居中对齐，然而很快就失望的发现 CSS 中并不存…

style和link多有一个media属性，默认是screen值，我们可以这样赋值：media="screen and (max-width: 1000px)";当屏幕的宽度小于1000像素时，此段样式生效。 media常见的属性还有print,只有在打印或者打印预览的时候样式…

css 动画的动画制作没有什么特别高深的地方，引入少量的 css 代码就能实现丰富多彩的页面效果是作为一个 web 前端开发者所推崇的，但我想要强调的是掌握并深入的理解 css 的基础，以及灵活的运用是做出一个画面美观、代码简洁、性能高效的 css 动画的必备技能。今天，我也就不再多做赘述，我就…

每个制作出来的css3动画都凝结了设计者和创作者智慧的结晶，以此，我们要向前辈致敬；动画的出现给单调的网页平添了活性，是单纯的展示页面变得不再那么枯燥，所以，作为一个web前端的开发者能够创作出属于自己的特有的动画，我感到很高兴。 今天，我向大家介绍实现css下拉菜单的动画制作…

Flex布局 display: flex; 将对象作为弹性伸缩盒展示，用于块级元素 display: inline-flex; 将对象作为弹性伸缩盒展示，用于行内元素 注意兼容问题： webkit内核浏览器应使用前缀-webkit IE浏览器，可以很好的兼容IE11+版本，对于…

今天我们来讲述css3能够做成动画的最小独立单元,并且讲述如何使用这些独立的单元来构成一个‘高大尚’的组合动画。 这是我在网上找的一个案例，修改后的效果图，虽说不是特别的‘高大尚’，但我认为这也跟高大尚占了一点了，中间的菜单按钮就是我们在做responsive开发时会用的到的效…

熟悉水平居中和垂直居中的方法, 不为别的, 就为用的时候能够信手拈来. 下面直接步入正题.原文：16种方法实现水平居中垂直居中 水平居中 1) 若是行内元素, 给其父元素设置 text-align:center,即可实现行内元素水平居中. 2) 若是块级元素, 该元素设置 ma…