قرینه کردن تصاویر وب سایت با استفاده از CSS

شما میتوانید با استفاده از کدهای CSS تصاویر نشان داده شده در وب سایت خود را به صورت بر عکس و قرینه نشان دهید. فرض کنید در محلی از صفحه وب سایت خود تصویر فِلشی که به سمت راست اشاره می کند دارید. دیگر نیازی نیست برای نشان دادن فلشی به سمت چپ یک تصویر به حجم وبسایت خود اضافه کنید. کافیست با استفاده از این تکنیک تصویر موجود را قرینه کنید. همچنین متوانید تصاویر متنی، دکمه ها، تصاویر پس زمینه و … در وب سایت خود را توسط این روش در جهت مخالف نمایش دهید.

برای این منظور کافیست تکه کد css زیر را برا روی تصویر ممورد نظر خود اعمال نمائید:

 img {
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
}
برای مثال لوگوی موسسه آموزشی فرهنگ نوین را مشاهده کنید:
حالت عادی :
 قرینه کردن تصاویر وب سایت با استفاده از CSSحالت قرینه :
قرینه کردن تصاویر وب سایت با استفاده از CSS

تا کنون دیدگاهی برای این مطلب ارسال نشده است. اولین نفری باشید که دیدگاه خود را بیان می کند


دیدگاه خود را بیان کنید

به منظور بیان دیدگاه خود لطفا ابتدا وارد سایت شوید