Home > Article > Web Front-end > How to use css rotation property

How to use css rotation property

青灯夜游Original: 2019-05-29 16:01:043515browse

The rotation attribute is a new attribute of CSS3, which is used to rotate block-level elements counterclockwise around the specified point defined by the rotation-point attribute. Borders, padding, content, and background (not fixed) are also rotated! However, currently mainstream browsers do not support this attribute.

How to use the css rotation property?

The rotation attribute rotates the block-level element counterclockwise around the specified point defined by the rotation-point attribute.

Syntax:

rotation: angle;

Attribute value:

●angle: element rotation angle. Possible values: 0deg to 360deg.

Note: Borders, padding, content and background (non-fixed) will also be rotated! Currently, mainstream browsers do not support the rotation attribute.

css rotation property example

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style> 
h1
{
rotation-point:50% 50%;
rotation:180deg;
}
</style>
</head>
<body>
<h1>旋转效果</h1>
<p><b>注释：</b>目前没有浏览器支持 rotation-point 或 rotation 属性。</p>
</body>
</html>

The above is the detailed content of How to use css rotation property. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：How to use css resize attributeNext article：How to use css resize attribute

See more

How to use css rotation property

Related articles