Then, I find in CSSs this -webkit-transform, but I have no idea what it is or what it is for and God does not know how to respond:
I would be eternally grateful if someone could explain or pass me some place where I can read about it. Note: I can read English.
Thanks for the attention !!
transform is a modern CSS tool. It allows you to zoom, give perspective, or rotate elements.
The suffix -webkit- means that only browsers that have webkit structure will use / read / apply this rule.
An example that is on the MDN page and that rotates 5 degrees a div element:
#rotate1
{
height:100px;
background-color: yellow;
-moz-transform: rotate(5deg);
-ms-transform: rotate(5deg); /* IE 9 */
-webkit-transform: rotate(5deg); /* Chrome, Safari, Opera */
transform: rotate(5deg);
}<div id="rotate1">
<pre>
height:100px;
background-color: yellow;
-moz-transform: rotate(5deg);
-ms-transform: rotate(5deg);
-webkit-transform: rotate(5deg);
transform: rotate(5deg);
</pre>
</div>And an example of zoom with rotation:
div {
background:#fcf8b3;
border:1px solid #aaa;
margin:100px;
padding:10px;
width:330px;
-webkit-transition:-webkit-transform 0.2s ease-in-out;
-moz-transition:-moz-transform 0.2s ease-in-out;
transition:transform 0.2s ease-in-out;
}
div:hover {
cursor:pointer;
/* CSS3 */
-webkit-transform:scale(3) rotate(-15deg) skew(-5deg, 30deg);
-moz-transform:scale(3) rotate(-15deg) skew(-5deg, 30deg);
transform:scale(3) rotate(-15deg) skew(-5deg, 30deg);
} <div>
Passa o mouse aqui se vês mal!
</div> Regarding your search on Google, you have to take into account that - at the beginning of a search means: "I want results without the word -xxxxxx".
You should search with quotation marks, #
#rotate1
{
height:100px;
background-color: yellow;
-moz-transform: rotate(5deg);
-ms-transform: rotate(5deg); /* IE 9 */
-webkit-transform: rotate(5deg); /* Chrome, Safari, Opera */
transform: rotate(5deg);
}<div id="rotate1">
<pre>
height:100px;
background-color: yellow;
-moz-transform: rotate(5deg);
-ms-transform: rotate(5deg);
-webkit-transform: rotate(5deg);
transform: rotate(5deg);
</pre>
</div>