问题记录,便于自己查找
发表于
问题记录
分类,标签:
07
07月
2015
0
1.prefixfree.js失效的原因是什么呢?1.检查页面是否是在服务器上运行,(火狐可以在本地运行);2.检查css属性是否是通过import方式引入的,prefixfree.js 不鸟@import;3.对于特殊的样式需要修改样式例如 background-image:linear-gradient(top,#0000%,#fff100%);修改改写成background-image:-*-linear-gradient(top,#0000%,#fff100%); 2.pointer-events:none;在ie9上失效的原因是什么呢?1.ie只要背景容器有背景色平铺,那么此属性就会失效,不能进行穿透; 例如:<div class="fd_bj&q...
CSS3弹性盒模型flexbox
发表于
css3
分类,标签:
06
07月
2015
弹性布局(flexiblebox)模块(目前是w3c候选的推荐)旨在提供一个更加有效的方式来布置,对齐和分布在容器之间的各项内容,即使它们的大小是未知或者动态变化的。弹性布局的主要思想是让容器有能力来改变项目的宽度和高度,以填满可用空间(主要是为了容纳所有类型的显示设备和屏幕尺寸)的能力。最重要的是弹性盒子布局与方向无关,相对于常规的布局(块是垂直和内联水平为基础),很显然,这些工作以及网页设计缺乏灵活性,无法支持大型和复杂的应用程序(特别当它涉及到改变方向,缩放、拉伸和收缩等)。属性介绍display:flex|inline-flex;(适用于父类容器元素上)flex:none|[ flex-grow ]||[ flex-shrink ]||[ flex-basis ]默认值:看各分拆属性适用于:弹性盒模型...
Snap.svg.js绘图出现的一些问题以及解决方案
发表于
svg
分类,标签:
03
07月
2015
动态创建的svg1追加到父元素的svg2中,动态创建的svg1下的子元素全部创建在svg2下;解决方案:例子:var svg2=Snap(1000,400);svg2.attr({id:"parent"})var svg1=Snap(400,300); svg2.append(svg1);//(注意这里是在svg1还没创建元素就把svg1追加到svg2后面) varcircle= svg1.paper.el("circle",{cx:50,cy:50,r:20,fill:"red"})这里只需要把svg2.append(svg1);//这句话放到最后面就行;或者: svg1.append(circle);//这样写一句话...
Box-shadow常被遗忘的一个参数——“spread”
发表于
css3
分类,标签:
01
07月
2015
本文转自(http://www.w3cplus.com/css3/css3-box-shadows-unnoticed-spread)早前在《CSS3box-shadow》一文中详细介绍了Box-shadow的使用。他可以让我们轻松的实现盒子阴影效果,多个站点都有这方面的介绍,比如说:peterkroener.de、dev.opera.com、viget.com,本站中的《CSS3制作DropShadow效果》也介绍了十几种阴影效果。但记得有一回在群里和朋友讨论这个属性时发生热烈的讨论。讨论的主题就是:box-shadow: 0 10px 10px #ccc;和box-shadow: 0 10px 10px -10px #ccc;这两种写法哪种是正确的。一开始我以为...
理解SVG坐标系统和变换: transform属性
发表于
svg
分类,标签:
30
06月
2015
(本文转自http://www.w3cplus.com/html5/svg-transformations.html)SVG元素可以通过缩放,移动,倾斜和旋转来变换-类似HTML元素使用CSStransform来变换。然而,当涉及到坐标系时这些变换所产生的影响必然有一定差别。在这篇文章中我们讨论SVG的transform属性和CSS属性,包括如何使用,以及你必须知道的关于SVG坐标系变换的知识。这是我写的SVG坐标系统和变换部分的第二篇。在第一篇中,包括了任何要理解SVG坐标系统基础的需要知道的内容;更具体的是,SVGviewport, viewBox 和 preserveAspectRatio 属性。理解SVG坐标系和变换(第一部分)-viewport,viewBox,和preserveAspectRatio理解SVG坐标系和变换(第二部分...
理解SVG坐标系统和变换: 建立新视窗
发表于
svg
分类,标签:
30
06月
2015
(本文转自http://www.w3cplus.com/html5/nesting-svgs.html)在SVG绘制的任何一个时刻,你可以通过嵌套<svg>或者使用例如<symbol>的元素来建立新的viewport和用户坐标系。在这篇文章中,我们将看一下我们如何这样做,以及这样做如何帮助我们控制SVG元素并让它们变得更加灵活(或流动)。这是SVG坐标系和变换系列的第三篇也是最后一篇文章。在第一篇中,包括了任何要理解SVG坐标系统基础的需要知道的内容;更具体的是,SVGviewport, viewBox和 preserveAspectRatio属性。在第二篇文章里,你可以了解到任何你需要了解的关于SVG系统变换的内容。理解SVG坐标系和变换(第一部分)-viewport,viewBox,和preserveAspectRatio理解SVG坐标系...
svg g标签的运用
发表于
svg
分类,标签:
29
06月
2015
在svg中提供了如g元素这样的将多个元素组织在一起的元素。由g元素编组在一起的可以设置相同的颜色,可以进行坐标变换下面是运用了snap.svg.js的实例// 创建一个svg对象var snap=Snap("#circle");snap.attr({width:1000,height:600});// 路径vard="M45.72,23.661C45.663,10.593,35.487,0,22.86,0C10.234,0,0,10.593,0,23.661"+ "c0,13.383,14.294,33.036,20.257,40.65c1.308,1.67,3.829,1.675,5.141,0.009C31.394,56.709,45.78,37.05,45.72,23.661&qu...
SVG 参考手册
发表于
API
分类,标签:
29
06月
2015
SVG元素元素说明属性<a>创建一个SVG元素周围链接xlink:showxlink:actuatexlink:hreftarget<altGlyph>允许对象性文字进行控制,来呈现特殊的字符数据xydxdyrotateglyphRefformatxlink:href<altGlyphDef>定义一系列象性符号的替换id<altGlyphItem>定义一系列候选的象性符号的替换id<animate>随时间动态改变属性attributeName="目标属性名称"from="起始值"to="结束值"dur="持续时间"repeatCount="动画时间将发生"<animateColor>定义随着时间的推移颜色转换by=&q...
在SVG中使用滤镜效果和输出文字
发表于
svg
分类,标签:
29
06月
2015
(下文转自http://begoodluck.blog.163.com/blog/static/2045072802013414103539404/)2013-05-1422:35:39| 分类: web开发 | 标签:svg |举报|字号 订阅 下载LOFTER客户端为了使图像更生动形象,可以在SVG中使用滤镜效果和输出文字的基本方法。一、在SVG中使用滤镜效果在SVG中,我们可以直接对基本图象和文字使用这些效果,在SVG使用滤竟效果就和AdobePhotoshop、MacromediaFireworks中一样,比如:阴影、高斯模糊、金属效果,颜色渐变等,SVG中的滤镜效果有feBlend、feColorMatrix、feComponentT...
CSS box-flex属性,然后弹性盒子模型简介
发表于
css3
分类,标签:
26
06月
2015
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1338一、淡淡的开头语昨天趁着不想工作的时间间隙闲逛24ways,在MyCSSWishList一文中,见到了个新鲜的CSS属性,就是题目中的box-flex,以前没有见过,顿生疑惑,不知是骡子还是马,于是习惯性谷歌之,真是不谷不知道,一谷吓一跳。倒不是该属性本身,而是此属性作为导火索,让我了解了下CSS3中新的盒子模型——弹性盒子模型(FlexibleBoxModel)。对于我这样的流体布局控而言,这种盒子模型的出现就好比打麻将杠上开花杠到绝张边七条,让人兴奋不已。在国外,弹性盒子模型早在去年就开始被提及,研究,与应用。然而,自己现在才第一次听到此概念,真是一不留神就out了...