css ps倒过来

html-css014

css ps倒过来,第1张

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

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

代码如下：

<html>

<meta charset="UTF-8"/>

<head>

<title>This is a test!</title>

<style>

.test {

filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=2)

/* IE6,IE7 */

ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)"

/* IE8 */

-moz-transform: rotate(-180deg)

/* 火狐3.5+ */

-o-transform: rotate(-180deg)

/* Opera 10.5 */

-webkit-transform: rotate(-180deg)

/* Safari 3.1+, Chrome */

position: absolute

}

</style>

</head>

<body>

<div class="test">Hello world！你好，世界！</div>

</body>

</html>

float:right 当然会颠倒顺序

这么写应该没问题

<ul style="float:left">

    <li style="float:left>1</li>

    <li style="float:left>2</li>

    <li style="float:left>3</li>

</ul>

<ul style="float:right">

    <li style="float:left>1</li>

    <li style="float:left>2</li>

    <li style="float:left>3</li>

    <li style="float:left>4</li>

    <li style="float:left>5</li>

</ul>