background-clip 和 background-origin

下面都是我自己的理解, 如果有不对的地方, 还请大家帮忙指出.下面是在 chrome 浏览器上测试的background-clip 和 background-origin先说说background-imagebackground-image 默认的起始位置是 padding 外边缘的左上角. 如下图所示:但是注意: 默认的结束位置却是 border 外边缘的右下角, 如下图

业界 2016年07月27日

谈谈关于CSS中transform属性之scale

谈谈关于scale属性scale是什么？根据W3C定义 ,scale主要是进行缩放和转化:scale能做什么？1.1px细线CSS代码.wrap{ position: relative;}.UI_scale1{ position: relative; width: 200px; height: 50px; border-bottom:1

业界 2016年07月27日

零React基础入门Amae UI Touch！

全文的目的是达成使用amazeui-touch进行项目开发，并且以我这个前端菜鸟所见所学来归纳整理。文章不对详细内容做讲解。环境安装与前期准备我的基础环境：Win10ATOM ： GitHub出的开源的编辑器CMDER ： https://nodejs.org/en/ 官网直接下载最新版安装即可基本的配置需求：webpack: https://webpack.github

业界 2016年07月27日

带你玩转css3的3D！

话不多说，先上demo酷炫css3走马灯/正方体动画： https://segmentfault.com/a/https://bupt-hjm.github.io/cs...github源码地址：https://segmentfault.com/a/https://github.com/BUPT-HJM/c...酷炫css3翻页动画： https://segmentfaul

业界 2016年07月27日

position:absolute的容器居中

web页面开发中，最经常是使用的当然要属于容器居中啦，“居中”有时候是一个很简单的问题，但是！有时候也让人苦恼的“牙痒痒”！HTML代码如下： child containerCSS代码（不占据文档流，水平居中）如下：# parents { width: 100%; position: relative; background-color: pink;

业界 2016年07月27日

巧用CSS遮罩

1. 用法-webkit-mask样式是利用该属性指定的图片作为遮罩，利用这张图像的透明度来显示位于该遮罩图下方的图像。如果遮罩图某个像素点透明度为1则显示下方的图像，透明度为0则不显示，介于0-1之间则呈现相应的透明度。详情参考 mask - CSS | MDN可以看到，mask的语法基本上拷贝自background，可以设置遮罩的url, position, repea

业界 2016年07月28日

JS实现时钟效果

闲来无事，用JS写了个时钟，只要思路理清了，做起来其实还挺简单的。先发个效果链接 点击查看Demo代码实现HTML 9 10 11 12 1 2 3

业界 2016年07月28日

前端开发者应该知道的 CSS 小技巧

一些小技巧让你的CSS技术更专业1,使用:not()去除导航上不需要的边框2,为body添加行高3,垂直居中任何元素4,逗号分离的列表5,使用负nth-child选择元素6,使用SVG图标7,文本显示优化8,在纯CSS幻灯片上使用max-height9,继承box-sizing10,表格单元格等宽11,使用Flexbox摆脱边界Hack12,使用属性选择器选择空链接使用:n

业界 2016年07月29日

基于float的几种布局

在这里介绍基于float的几种布局.1.浮动与两侧自适应的布局如图所示，左边没有限定宽度，右边宽度自适应。使用table-cell实现的布局，可以适用于两栏的布局。HTML代码与浮动与两侧自适应的布局改变DOM树先后顺序的方法HTML代码浮动与右侧尺寸固定的流体布局与右侧尺寸固定的浮动布局与右侧尺寸固定的浮动布局与右侧尺寸固定的浮动布局与右侧尺寸固定的浮动布局与右侧尺寸固定

业界 2016年07月30日

和BEM的战斗：10个常见问题及如何避免

无论你是刚刚发现BEM或者已经是个中熟手（作为web术语来说），你可能已经意识到它是一种有用的方法。如果你还不知道BEM是什么，我建议你在继续阅读这篇文章之前去BEM website了解一下它，因为我会假设你对这种CSS的方法有一个基础的理解。本文旨在对那些已经是BEM的爱好者或是想要去更有效率的使用它或是非常好奇并且想去学习它的人有所帮助。现在，我对BEM是一个优雅的命名

业界 2016年08月01日