Web开发网 > Web前端开发 > Web前端开发教程 > HTML/CSS兼容/XML > 热门博文
首页 上一页 [1] [2] [3] [4] [5] [6] [7] [8] [9] [10] [11] 下一页 尾页 5/11页，每页显示30条，共320条相关记录
CSS3动画transform-origin属性默认情况，变形的原点在元素的中心点，或者是元素X轴和Y轴的50%处，如下图所示： 我们没有使用transform-origin改变元素原点位置的情况下，CSS变形进行的旋转、移位、缩放等操作都是以元素自己中心（变形原点）位置进行变形的。但很多时候需要在不同的位置对元素进行变形操作，我们就可以使用transform-origin来..
功能描述：显示十字线在图片上，十字线交叉中心为鼠标所在位置，十字线随鼠标移动而更改位置 查看效果点击这里 源代码如下style type=text/css#dv{position:relative;}#linex{height:1px;width:300px;position:absolute;left:0px;background:#000;overflow:hidden;display:none;}#liney{height:300px;width:1px;position:absolute;top..
canvas画布是一项很强大的东西，先来看一下canvas中的坐标原点，及正、负坐标的取值 那就先试着画一个米字吧，高手莫笑！canvas id=diagonal style=border: 1px solid blue; width=200 height=200/canvasscript type=text/javascriptwindow.onload=function(){ var canvas = document.getElementByIdx_x('diagonal'); //指..
IE6,IE7对css样式display inline-block的支持有问题，需要经过css hack后才会支持。注意：IE8需要加xhtml申明变为css1compat模式才会支持inline-block，backcompat模式不支持，但是可以通过css hack来实现，和IE7-一样。 要想让IE6,IE7支持css样式display inline-block，有下面2种方法1、先使用display:inline-block属性触发块元素，然后..
CSS3 transform制作的Windows徽标，使用IE9+或者chrome，firefox等测试效果style#windows .canvas { background: #fff;}#windows .icon { left:193px; position: absolute; top:20px; -moz-transform: rotate(16deg); -webkit-transform: rotate(16deg); transform: rotate(16deg);}.window-e1,.window2,.window3,..
Clipping的中文解释就是剪辑的意思，这个属性决定了对象的哪个部位可以被看到。它不会改变任何对象的性质。 Clipping 的区域是一个矩形， 而这个矩形的尺寸取决于于四个边的位置。 这四个边用 top, right, botton, left 来表示。 请注意：这四个边的位置是相对于对象的而不是相对于窗口的。 Clip属性的书写格式是这样的： Clip rect（top，r..
在web开发中可能会遇到flash遮挡页面中元素的情况，无论怎么设置flash容器和层的深度(z-index)也无济于事，现有的解决方案 是在插入flash的embed或object标签中加入wmode属性并设置为wmode=transparent或opaque。 wmode即窗口模式总共有三种，Macromedia官方的说法：window 模式 默认情况下的显示模式，在这种模式下flash player有自己..
在HTML5中有11种组合图形的方式，只要把他们设置到context.globalCompositeOperation中就可以了，下面是一些证明各种图形组合方式的结果的示例。 HTML代码很简单，就2个控件，一个是下拉列表，让用户选择组合方式，并且一旦用户做出了选择，就执行js函数draw(id），从而在第二个控件canvas上根据用户当前选择的组合方式进行画图。第二个控..
在CSS3中，用Transform功能可以实现文字或图像的旋转、缩放、倾斜、移动这四种类型的变形，这四种变形分别使用rotate、 scale、skew和translate这四种方法来实现。将这四种变形结合使用，就会产生不同的效果，使用顺序不同，产生的效果是不一样的。 目前浏览器支持情况：Safari 3.1+、 Chrome 8+、Firefox 4+、Opera 10+、IE9+来源：http..