有没有办法只翻转左侧的边框图像?

时间:2019-04-08 02:25:32

标签: css

是否有一种方法可以使页面左侧的边框图像反转,从而使花边的笔直边缘像右侧一样位于页面中央?

屏幕截图:

https://lh3.googleusercontent.com/iQXLarNnWBe0CrIxKnZzhJMWHgMv3UISDqUuJv6B-NTbaSD3pJxycC0bKbgAe7lIsDfhmBnAS9sj_eAs4xNLFnME5egX3xEUpZxw3FNU46eeM_bpZucTOlZ2Uu0900mUS9e3jZ5ac5ePzfQl4W_i-iDZyP0QWurxKyeaP1cR-6WEcnpaCSUJofEjqEBEOjv5fLed5GTaLTklhLwEFvAdEnoIqwQigV3I0ZD6EYwpO1G6dNza6ejc8xVTkf294XUhkHxSQSovyj3IWif6Yfp3RyXflCwYZ7aMXL657WM7n3QxTve7YEZR68f_yq9rl8p8VUfyuwvUej1Rna43rl5fbN51vL33XUPQ5Q1Du0gA62Q2uxXzE-xy0fQWJixGl6xgQvHuECHM2sLQbYg3w_PHY8WTNIgTfcNoCIXSCobBS8zEBOO5q-iJRywvl631--KpYEQHQ_9APodsX0M0sRupMOIXiLdrHWvEcEd-yQ4g5t5oBagU3Cx6Pti37WlO_P4YTdp-virl8XTpZyFZeCy5cFpfGVuKNcVzEfWjfsQ6-bvkJhc1x7d3PWYPIZ7hUcM9pYPniy1Sx7P-VxZe-Vs-GWJzyh_BmXgS6-JuW8YLA4m4aO2V6nlz1QIkZS55BK0KMzAMYZi48evlzLIVZf2veuBjA8w5P2ROT-nETga2gnEnI10S1aZ495BcgwfPCkCOryTtxI5HilIsf1ULOSZsqjvn=w1277-h523-no

我已经做了很多在线搜索,但是我没有看到任何解决此问题的方法。

css文件:

div.wrapper {
    margin: 0 auto;
    width: 75%;
    border: solid transparent;
    border-width: 0 76px;
    border-image: 76 repeat url(https://lh3.googleusercontent.com/o-AmkgUtE-j5QcXB96gMQt80O4UxaDxMiP2En4imiWnF9ZN363dlePAyJRpeJvhQJWjUmRSp9wxKAnyW3AZsKsSmAy4NVD1ROnZ8LXMnT8-JcGac5ch9YXuyyRiyLOhTk5JJynfd8LKMVCg3VnQKAiXoT2CWrB8UHLNEUNcng1YLOyWN9k56q5n3vb8trNtv67SrANk77IiFpoM8_N0eu1i7zkqtk_kI2cxwwUn85dvHt42IkKzC1Q1TVNrG1cJ0-FKRaT9APUf3yGh79p423Zn-p6RCz2oeqT1uUu2qrVrVdn58betT27ROxrEjIhryCOTjsI4_A_IK9Zy5O4GJ7Y92DCNe1Ug18eetmFGMxW6eyuZJ9MkqXrGH1dCv43dJYWQNYjn7N-dB63DeDCf3P6X_ARUKS_lKZfSPyazlBRAPrBVvFaIu8RXJh3bdM0SfSR6SIOuy4Wzo_8DF8rHZ71YJMq9yQ7yE4Eend3VsFqan2jasLpQd2oUN-dE82QUs6v2PoOynQhVqkUDe5AkIKn4BGX1YnoqImLRMUVYzYN0WVx-ikxEWgDVTnYU9PqK5D41ePIyTdNNq3BLB2s-5RMqyaILGageeZhE2Mv14_QYyY5-PQpYK-pvBG6iKNBEZc91cDYXSnuVKBeV8j5hYE00HAJYm3hiIuux23JwUC5POkIkzXDNJcV06Wr_FdNc5__FiWEPe39ANlRpgx4KWB7fJ=w76-h320-no);
}

1 个答案:

答案 0 :(得分:1)

翻转图像是通过transform

完成的
-webkit-transform: scaleX(-1);
  transform: scaleX(-1);

希望获得帮助。