css ps倒过来

html-css022

css ps倒过来,第1张

css可以通过perspective属性来实现。ps可以直接通过滤镜中的翻转效果实现。

对于ps,首先打开Photoshop,导入需要编辑的图片,用选取工具选定图片,在工具栏中打开滤镜效果,选择反转效果即可。对于css,css实现翻转效果的方法,首先创建一个演示方块,并为其添加transition和transform属性,然后将transition属性添加到需要翻转的p上,最后添加perspective和transform-style属性即可。

最近在做移动端开发的时候,有时候会遇到设置的背景图被莫名其妙的旋转了90°,这是为什么呢?

原因是这个图片携带了exif信息,去掉这个信息就可以了,图片也就恢复正常显示了,在src的路径后面加上参数imageMogr2/auto-orient即可;例如:<img src="123.png?imageMogr2/auto-orient"/> 

对你的问题倒是没有答案,只是看到你问题,想插句嘴。你注意-webkit前缀,你要用这种方式实现了,你不用webkit内核的浏览器完全没法看。你应该写:

transform:rotate(180deg)

-ms-transform:rotate(180deg)/* IE 9 */

-moz-transform:rotate(180deg)/* Firefox */

-webkit-transform:rotate(180deg)/* Safari and Chrome */

-o-transform:rotate(180deg)/* Opera */

目前情况下,正确的方式在目前是通过js配合css实现,css3距离普及还早着呢。目前主流浏览器对css3和html5的实现方式完全不一样,所以都得单独设置。