㈠css3的新特性实际应用 ⑴文本阴影效果,用代码编写的方式实现 ⑵鼠标悬停的动态效果 左侧三幅图片,上面初始状态是没有说明文本的,但把鼠标放在上面的时候,这个图片上面就出现了说明文字 ⑶分栏分列式排版:类似于报刊的排版方式 ⑷做一个盒子它的圆角边框,还可以做一个盒子的阴影效果,若干个盒子的旋转效果 ...
分类:
Web程序 时间:
2019-08-03 00:34:02
阅读次数:
128
CSS 用于控制网页的样式和布局,而CSS3 是最新的 CSS 标准。 CSS3的规范仍在开发中,有些CSS3并不能完美兼容所有浏览器。 CSS3被拆分为"模块"。旧规范已拆分成小块,还增加了新的。 一些最重要CSS3模块如下: 选择器 盒模型 背景和边框 文字特效 2D/3D转换 动画 多列布局 ...
分类:
Web程序 时间:
2019-07-25 17:43:45
阅读次数:
224
上次解释了如何使用代码识别双指和单指操作及放大和旋转拖动操作。这次解释下css3的transform原理 一、transform矩阵原理 transform: matrix(a,b,c,d,e,f) ax+cy+e为变换后的水平坐标,bx+dy+f表示变换后的垂直 二、Transform的原理即是坐 ...
分类:
其他好文 时间:
2019-07-23 09:27:02
阅读次数:
118
原文:www.zhangxiyu 一、CSS下兼容性的元素水平/垂直翻转实现 随着现代浏览器对CSS3的支持愈发完善,对于实现各个浏览器兼容的元素的水平翻转或是垂直翻转效果也就成为了可能。相关的CSS代码如下: /*水平翻转*/ .flipx { -moz-transform:scaleX(-1); ...
分类:
Web程序 时间:
2019-07-19 20:48:10
阅读次数:
135
css3的2d转化,我所知的有5种。 因为是css属性,所以必然,2d转化的设置在style中设置基本格式,transform:XXX;以选择哪种转化,还可以设置transition:time;以设置转化时间(不过不能设置在初始状态下,否则无效) 下面按标号进行介绍: 1.translate 有2种 ...
分类:
Web程序 时间:
2019-07-18 19:35:31
阅读次数:
132
border-radius(边框的半径) 平时我们在css2中用到border也就是设置成一个圆,或者四个角的圆润粗细,今天我们就来看看在css3的border。 border中4个角的对应是: 设置一个值跟设置四个同样的值是一样的 圆角 ...
分类:
Web程序 时间:
2019-07-17 00:27:54
阅读次数:
123
JQuery的animate()方法可以通过渐变的更改CSS属性来实现简单的动画效果, 比如 setp回调函数会在每次数据发生变化时调用。这样就可以通过val的值来控制一些非CSS3的属性实现动画效果。 注:上述代码中出现的两个height只是个名字,可以随意取,不影响代码运行。 ...
分类:
Web程序 时间:
2019-07-14 16:33:32
阅读次数:
144
css实现背景透明而文字不透明 平时我们所说的调整透明度,其实就是在样式中调整不透明度,而实现透明的css方法通常有如下3中方式: css3的opacity:x。x的取值为0到1,如opacity:0.5表示不透明度为50%; css3的rgba(red,green,blue,alpha),alph ...
分类:
Web程序 时间:
2019-07-14 09:19:24
阅读次数:
121
关于css动画tansform:translateZ(100PX)没有效果的记录 之前学习cs3动画就学的迷迷糊糊的,这次项目中刚好用到了cs3动画,遇到了一个问题,记录下来,方便后期查阅 在使用 tansform属性时,值设为tansform:translateX或tansform:transla ...
分类:
Web程序 时间:
2019-07-09 19:39:40
阅读次数:
167
关于css动画tansform:translateZ(100PX)没有效果的记录 之前学习cs3动画就学的迷迷糊糊的,这次项目中刚好用到了cs3动画,遇到了一个问题,记录下来,方便后期查阅 在使用 tansform属性时,值设为tansform:translateX或tansform:transla ...
分类:
Web程序 时间:
2019-07-09 19:22:24
阅读次数:
430