CSS中可以使用不同的屬性來實現圖片效果，包括:

img {
max-width: 100%;
}
/* 水平翻轉 */
.flip-horizontal {
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
filter: FlipH;
-ms-filter: "FlipH";
}
/* 垂直翻轉 */
.flip-vertical {
-moz-transform: scaleY(-1);
-o-transform: scaleY(-1);
-webkit-transform: scaleY(-1);
transform: scaleY(-1);
filter: FlipV;
-ms-filter: "FlipV";
}
/* 旋轉180度 */
.rotate-180 {
-moz-transform: rotate(180deg);
-o-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
/* 圓角 */
.rounded {
border-radius: 50%;
}
/* 灰階 */
.grayscale {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
/* 透明度 */
.opacity {
opacity: 0.5;
}

使用這些屬性可以輕松地實現各種各樣的圖片效果，例如水平/垂直翻轉、旋轉、圓角、灰階等。另外，通過改變透明度也可以實現一些特殊的效果。