Css入門: image-orientation（圖像方向）

CSS的image-orientation屬性用于控制圖像的方向。它可以讓你改變圖像的顯示方向，使其適應(yīng)不同的布局需求。

成都創(chuàng)新互聯(lián)專注于企業(yè)營銷型網(wǎng)站、網(wǎng)站重做改版、薩迦網(wǎng)站定制設(shè)計、自適應(yīng)品牌網(wǎng)站建設(shè)、H5建站、商城網(wǎng)站建設(shè)、集團公司官網(wǎng)建設(shè)、外貿(mào)網(wǎng)站制作、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁設(shè)計等建站業(yè)務(wù)，價格優(yōu)惠性價比高，為薩迦等各大城市提供網(wǎng)站開發(fā)制作服務(wù)。

語法

image-orientation屬性的語法如下：

image-orientation: auto|flip|none|initial|inherit;

屬性值：

• auto：默認(rèn)值。圖像的方向由瀏覽器自動決定。
• flip：將圖像水平翻轉(zhuǎn)。
• none：圖像保持原始方向。
• initial：將屬性重置為默認(rèn)值。
• inherit：繼承父元素的屬性值。

示例

下面是一些使用image-orientation屬性的示例：

img {
  image-orientation: flip;
}

img {
  image-orientation: none;
}

在第一個示例中，圖像將水平翻轉(zhuǎn)顯示。在第二個示例中，圖像保持原始方向。

瀏覽器兼容性

image-orientation屬性的瀏覽器兼容性如下：

瀏覽器	兼容性
Chrome	支持
Firefox	支持
Safari	支持
Edge	支持
IE	不支持

總結(jié)

通過使用CSS的image-orientation屬性，我們可以輕松地改變圖像的顯示方向，以適應(yīng)不同的布局需求。這個屬性在現(xiàn)代瀏覽器中得到了廣泛的支持，但在IE瀏覽器中不可用。

如果你想了解更多關(guān)于CSS的image-orientation屬性的信息。

網(wǎng)頁標(biāo)題：Css入門:image-orientation（圖像方向）
文章源于：http://www.5511xx.com/article/djpcjee.html