刚学习了flex弹性布局,于是给学生们练手了一个小页面,利用flex弹性布局结合media queries媒体查询和calc()计算函数实现了一个响应式的页面设计。flex弹性布局在一维布局上好用,但...
2019年03月28日 3623
最近更新
JavaScript教程
JavaScript基础1:JavaScript的前世今生
JavaScript,我们喜欢简称为js,这是一门基于浏览器就可以解释的脚本语言。随着移动端的火爆,JavaScript也是借着东风扶摇直上,成为了这几年上升势头最猛的编程语言。不过,JavaScript的出身不太好。1995年,网景公司,也就是开发出第一款最流行的Navigator浏览器的公司,为...
2019年03月27日 3067
CSS教程
CSS3第十八课:响应式web布局——grid 栅格布局基础介绍
一、什么是栅格布局一提到响应式布局,很多人都会使用框架,比如熟知的bootstrap,但是框架大而全,相应的代码就冗余,有时候开发一个小应用根本不用上框架,直接自己搭建一个小的栅格系统就可以用了。其实栅格,说直白一点就是把页面划分成很多等分的列。比如,经典的12grid,就是把网页划分成等分的12列...
2019年03月26日 4281
CSS教程
CSS3提供的一个计算函数calc(),在响应式的计算上很有帮助
CSS3提供的函数calc(),是calculate(计算)的缩写,具有计算的能力,允许通过+ - * / 运算符构成一个数学表达式,最终产生一个具体的value值。
calc()是动态计算,任何数值都可以用这个函数计算,比如width,height,font-size...
2019年03月25日 4831
CSS教程
css3第十七课:filter滤镜,真美颜
因为Edge13支持这个属性了,所以打算写出来,毕竟已经看到有项目使用这个CSS3的新属性了。CSS3 filter 属性是用来为一个元素(通常是图片)添加特殊的效果。一、语法结构filter: none | blur() | brightness(...
2019年03月20日 3259
CSS教程
html5提供的picture标签可以更好地解决图片响应式的问题
一、图片响应式设计的老方法。在以前为图片做响应式设计的时候,一般用三种方法。第一种,直接让图片和父容器保持100%:img {
width: 100%;
height: ...
2019年03月11日 3006