CSS 2D ﺩﻮﺷ ﯽﻣ ﻞﯾﺪﺒﺗ

فهرست مطالب

    نمایش فهرست مطالب

CSS 2D ﺩﻮﺷ ﯽﻣ ﻞﯾﺪﺒﺗ

.ﺪﯿﻨﮐ ﻪﻟﻮﭼ ﻭ ﺪﯿﻨﮐ ﯼﺪﻨﺑﺱﺎﯿﻘﻣ ،ﺪﯿﻧﺎﺧﺮﭽﺑ ،ﺎﺟﻪﺑﺎﺟ ﺍﺭ ﺮﺻﺎﻨﻋ ﺪﻨﻫﺩﯽﻣ ﻥ

:ﺪﯿﻨﯿﺒﺑ ﺍﺭ ﯼﺪﻌﺑ ﻭﺩ ﻞﯾﺪﺒﺗ ﺎﺗ ﺪﯿﻫﺩ ﺭﺍﺮﻗ ﺮﯾﺯ ﺮﺼﻨﻋ ﯼﻭﺭ ﺍﺭ ﺱﻭﺎﻣ

2D rotate

:ﺪﯾﻮﺷ ﯽﻣ ﺎﻨﺷﺁ ﺮﯾﺯ CSS ﯼﺎﻫ ﯽﮔﮋﯾﻭ ﺎﺑ ﻞﺼﻓ ﻦﯾﺍ ﺭﺩ

transform

ﺮﮔﺭﻭﺮﻣ ﯽﻧﺎﺒﯿﺘﺸﭘ

.ﺪﻨﮐ ﯽﻣ ﯽﻧﺎﺒﯿﺘﺸﭘ ﯽﮔﮋﯾﻭ ﺯﺍ ﻞﻣﺎﮐ ﺭﻮﻃ ﻪﺑ ﻪﮐ ﺪﻨﮐ ﯽﻣ ﺺﺨﺸﻣ ﺍﺭ ﺮﮔﺭﻭﺮﻣ ﻪﺨﺴﻧ ﻦﯿﻟﻭﺍ ﻝﻭﺪﺟ

Property
transform 36.0
 10.0
 16.0
 9.0
 23.0

CSS 2D Transforms Methods

:ﺪﯿﻨﮐ ﻩﺩﺎﻔﺘﺳﺍ ﺮﯾﺯ ﯼﺪﻌﺑﻭﺩ ﻞﯾﺪﺒﺗ ﯼﺎﻫﺵﻭﺭ ﺯﺍ ﺪﯿﻧﺍﻮﺗﯽﻣ

ﻪﺘﮑﻧ: ﺪﺷ ﺪﯿﻫﺍﻮﺧ ﺎﻨﺷﺁ ﯼﺪﻌﺑ ﻪﺳ ﯼﺎﻫ ﻞﯾﺪﺒﺗ ﺎﺑ ﯼﺪﻌﺑ ﻞﺼﻓ ﺭﺩ.

translate() ﺵﻭﺭ

Translate

ﻖﺒﻃ) ﺪﻫﺩﯽﻣ ﺖﮐﺮﺣ ﺩﻮﺧ ﯽﻠﻌﻓ ﺖﯿﻌﻗﻮﻣ ﺯﺍ ﺍﺭ ﺮﺼﻨﻋ ﮏﯾ t

.ﺪﻫﺩ ﯽﻣ ﺖﮐﺮﺣ ﺖﺳﺍﺭ ﺖﻤﺳ ﻪﺑ ﻞﺴﮑﯿﭘ 50 ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝﺎﺜﻣ

ﻝﺎﺜﻣ

div
{
   
transform: translate(50px, 100px);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style> 
div {
  width: 300px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
  transform: translate(50px,100px);
}
</style>
</head>
<body>

<h1>The translate() Method</h1>
<p>The translate() method moves an element from its current position:</p>

<div>
This div element is moved 50 pixels to the right, and 100 pixels down from its current position.
</div>

</body>
</html>

rotate() ﺵﻭﺭ

.ﺪﻧﺎﺧﺮﭼﯽﻣ ﯽﺼﺨﺸﻣ ﻪﺟﺭﺩ ﻪﺑ ﻪﺟﻮﺗ ﺎﺑ ﺖﻋﺎﺳ ﯼﺎﻫﻪﺑﺮﻘﻋ ﺖﻬﺟ ﻑﻼﺧ ﺎﯾ ﺖﻋﺎﺳ ﯼﺎﻫu20

:ﺪﻧﺎﺧﺮﭼ ﯽﻣ ﻪﺟﺭﺩ 20 ﺎﺑ ﺖﻋﺎﺳ ﯼﺎﻫ ﻪﺑﺮﻘﻋ ﺖﻬﺟ ﺭﺩ ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝﺎﺜﻣ

ﻝﺎﺜﻣ

div
{
  transform: rotate(20deg);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  width: 300px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
}

div#myDiv {
  transform: rotate(20deg);
}
</style>
</head>
<body>

<h1>The rotate() Method</h1>

<p>The rotate() method rotates an element clockwise or counter-clockwise.</p>

<div>
This a normal div element.
</div>

<div id="myDiv">
This div element is rotated clockwise 20 degrees.
</div>

</body>
</html>

.ﺪﻧﺎﺧﺮﭼ ﯽﻣ ﺖﻋﺎﺳ ﯼﺎﻫ ﻪﺑﺮﻘﻋ ﺖﻬﺟ ﻑﻼﺧ ﺭﺩ ﺍﺭ ﺮﺼﻨﻋ ﯽﻔﻨﻣ ﺮﯾﺩﺎﻘﻣ ﺯﺍ ﻩﺩﺎﻔﺘﺳﺍ

:ﺪﻧﺎﺧﺮﭼﯽﻣ ﻪﺟﺭﺩ 20 ﺎﺑ ﺖﻋﺎﺳ ﯼﺎﻫﻪﺑﺮﻘﻋ ﺖﻬﺟ ﻑﻼﺧ ﺭﺩ ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝﺎﺜﻣ

ﻝﺎﺜﻣ

div
{
   
transform: rotate(-20deg);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  width: 300px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
}

div#myDiv {
  transform: rotate(-20deg);
}
</style>
</head>
<body>

<h1>The rotate() Method</h1>

<p>The rotate() method rotates an element clockwise or counter-clockwise.</p>

<div>
This a normal div element.
</div>

<div id="myDiv">
This div element is rotated counter-clockwise with 20 degrees.
</div>

</body>
</html>

scale() ﺵﻭﺭ

Scale

.(ﻉﺎﻔﺗﺭﺍ ﻭ ﺽﺮﻋ ﯼﺍﺮﺑ ﻩﺪﺷ ﻩﺩﺍﺩ ﯼﺎﻫﺮﺘﻣﺍﺭﺎﭘ ﻪﺑ ﻪﺟﻮﺗ ﺎﺑ) ﺪﻫﺩ ﯽﻣ ﺶﻫﺎﮐ ﺎﯾ ﺶﯾﺍﺰﻓﺍ ﺍﺭ ﺮ

:ﺪﻫﺩ ﯽﻣ ﺶﯾﺍﺰﻓﺍ ﻥﺁ ﯽﻠﺻﺍ ﻉﺎﻔﺗﺭﺍ ﺮﺑﺍﺮﺑ ﻪﺳ ﻭ ﯽﻠﺻﺍ ﺽﺮﻋ ﺮﺑﺍﺮﺑ ﻭﺩ ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝ

ﻝﺎﺜﻣ

div
{
   
transform: scale(2, 3);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  margin: 150px;
  width: 200px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
  transform: scale(2,3);
}
</style>
</head>
<body>

<h1>The scale() Method</h1>

<p>The scale() method increases or decreases the size of an element.</p>

<div>
This div element is two times of its original width, and three times of its original height.
</div>

</body>
</html>

:ﺪﻫﺩ ﯽﻣ ﺶﻫﺎﮐ ﻥﺁ ﯽﻠﺻﺍ ﻉﺎﻔﺗﺭﺍ ﻭ ﺽﺮﻋ ﻒﺼﻧ ﻪﺑ ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝﺎﺜﻣ

ﻝﺎﺜﻣ

div
{
   
transform: scale(0.5, 0.5);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  margin: 150px;
  width: 200px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
  transform: scale(0.5,0.5);
}
</style>
</head>
<body>

<h1>The scale() Method</h1>

<p>The scale() method increases or decreases the size of an element.</p>

<div>
This div element is decreased to be half of its original width and height.
</div>

</body>
</html>

scaleX() ﺵﻭﺭ

ﺪﻫﺩ ﯽﻣ ﺶﻫﺎﮐ ﺎﯾ ﺶﯾﺍﺰﻓﺍ ﺍﺭ ﺭﺍﺪﻘﻣ scaleX() ﺵﻭﺭ

:ﺪﻫﺩ ﯽﻣ ﺶﯾﺍﺰﻓﺍ ﺩﻮﺧ ﯽﻠﺻﺍ ﺽﺮﻋ ﺮﺑﺍﺮﺑ ﻭﺩ ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝﺎﺜﻣ

ﻝﺎﺜﻣ

div
{
   
transform: scaleX(2);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  margin: 150px;
  width: 200px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
  transform: scaleX(2);
}
</style>
</head>
<body>

<h1>The scaleX() Method</h1>

<p>The scaleX() method increases or decreases the width of an element.</p>

<div>
This div element is two times of its original width.
</div>

</body>
</html>

:ﺪﻫﺩ ﯽﻣ ﺶﻫﺎﮐ ﻥﺁ ﯽﻠﺻﺍ ﺽﺮﻋ ﻒﺼﻧ ﻪﺑ ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝﺎﺜﻣ

ﻝﺎﺜﻣ

div
{
   
transform: scaleX(0.5);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  margin: 150px;
  width: 200px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
  transform: scaleX(0.5);
}
</style>
</head>
<body>

<h1>The scaleX() Method</h1>

<p>The scaleX() method increases or decreases the width of an element.</p>

<div>
This div element is half of its original width.
</div>

</body>
</html>

scaleY() ﺵﻭﺭ

ﺪﻫﺩ ﯽﻣ ﺶﻫﺎﮐ ﺎﯾ ﺶﯾﺍﺰﻓﺍ ﺍﺭ ﺭﺍﺪﻘﻣ scaleY() ﺵﻭﺭ

ﺪﻫﺩ ﯽﻣ ﺶﯾﺍﺰﻓﺍ ﺩﻮﺧ ﯽﻠﺻﺍ ﺮﺑﺍﺮﺑ ﻪﺳ ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝﺎﺜﻣ

ﻝﺎﺜﻣ

div
{
   
transform: scaleY(3);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  margin: 150px;
  width: 200px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
  transform: scaleY(3);
}
</style>
</head>
<body>

<h1>The scaleY() Method</h1>

<p>The scaleY() method increases or decreases the height of an element.</p>

<div>
This div element is three times of its original height.
</div>

</body>
</html>

ﺪﻫﺩ ﯽﻣ ﺶﻫﺎﮐ ﻥﺁ ﯽﻠﺻﺍ ﻒﺼﻧ ﻪﺑ ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝﺎﺜﻣ

ﻝﺎﺜﻣ

div
{
   
transform: scaleY(0.5);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  margin: 150px;
  width: 200px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
  transform: scaleY(0.5);
}
</style>
</head>
<body>

<h1>The scaleY() Method</h1>

<p>The scaleY() method increases or decreases the height of an element.</p>

<div>
This div element is half of its original height.
</div>

</body>
</html>

skewX() ﺵﻭﺭ

.ﺪﻨﮐ ﯽﻣ ﻑﺮﺤﻨﻣ ﻩﺪﺷ ﻩﺩﺍﺩ ﻪﯾﻭﺍﺯ ﺎﺑ X ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﺍﺭ ﺮﺼﻨﻋ ﮏﯾ

ﻝﺎﺜﻣ

div
{
   
transform: skewX(20deg);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  width: 300px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
}

div#myDiv {
  transform: skewX(20deg);
}
</style>
</head>
<body>

<h1>The skewX() Method</h1>

<p>The skewX() method skews an element along the X-axis by the given angle.</p>

<div>
This a normal div element.
</div>

<div id="myDiv">
This div element is skewed 20 degrees along the X-axis.
</div>

</body>
</html>

skewY() ﺵﻭﺭ

.ﺪﻨﮐ ﯽﻣ ﻑﺮﺤﻨﻣ ﻩﺪﺷ ﻩﺩﺍﺩ ﻪﯾﻭﺍﺯ ﺱﺎﺳﺍ ﺮﺑ Y ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﺍﺭ ﺮﺼﻨﻋ ﮏﯾ

ﻝﺎﺜﻣ

div
{
   
transform: skewY(20deg);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  width: 300px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
}

div#myDiv {
  transform: skewY(20deg);
}
</style>
</head>
<body>

<h1>The skewY() Method</h1>

<p>The skewY() method skews an element along the Y-axis by the given angle.</p>

<div>
This a normal div element.
</div>

<div id="myDiv">
This div element is skewed 20 degrees along the Y-axis.
</div>

</body>
</html>

skew() ﺵﻭﺭ

.ﺪﻨﮐ ﯽﻣ ﻑﺮﺤﻨﻣ ﻩﺪﺷ ﻩﺩﺍﺩ ﯼﺎﯾﺍﻭﺯ ﺎﺑ Y ﻭ X ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﺍﺭ ﺮﺼﻨﻋ ﮏﯾ

ﻝﺎﺜﻣ

div
{
   
transform: skew(20deg, 10deg);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  width: 300px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
}

div#myDiv {
  transform: skew(20deg,10deg);
}
</style>
</head>
<body>

<h1>The skew() Method</h1>
<p>The skew() method skews an element into a given angle.</p>

<div>
This a normal div element.
</div>

<div id="myDiv">
This div element is skewed 20 degrees along the X-axis, and 10 degrees along the Y-axis.
</div>

</body>
</html>

:ﺪﻫﺩ ﯽﻣ ﺮﯿﯿﻐﺗ X ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﻪﺟﺭﺩ 20 ﺍﺭ <div> ﺮﺼﻨﻋ ﺮﯾﺯ ﻝﺎﺜﻣ ،ﻦﯾﺍﺮﺑﺎﻨﺑ .ﺖﺳﺍ ﺮ

ﻝﺎﺜﻣ

div
{
   
transform: skew(20deg);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  width: 300px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
}

div#myDiv {
  transform: skew(20deg);
}
</style>
</head>
<body>

<h1>The skew() Method</h1>

<p>The skew() method skews an element into a given angle.</p>

<div>
This a normal div element.
</div>

<div id="myDiv">
This div element is skewed 20 degrees along the X-axis.
</div>

</body>
</html>

matrix() ﺵﻭﺭ

.ﺪﻨﮐ ﯽﻣ ﺐﯿﮐﺮﺗ ﺵﻭﺭ ﮏﯾ ﺭﺩ ﺍﺭ ﯼﺪﻌﺑﻭﺩ ﻞﯾﺪﺒﺗ ﯼﺎﻫﺪﺘﻣ ﻪﻤﻫ m

.ﺖﺳﺍ ﯽﺿﺎﯾﺭ ﻊﺑﺍﻮﺗ ﻞﻣﺎﺷ ﻪﮐ ﺩﺭﺍﺩ ﺮﺘﻣﺍﺭﺎﭘ ﺶﺷ()matrix ﺪﺘﻣ

(()skewY()، skewX()، scaleY()، translateX()، translateY ،(scaleX)ﺲﯾﺮﺗﺎﻣ :ﺪﻨﺘﺴﻫ

ﻝﺎﺜﻣ

div
{
    
transform: matrix(1, -0.3, 0, 1, 0, 0);
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div {
  width: 300px;
  height: 100px;
  background-color: yellow;
  border: 1px solid black;
}

div#myDiv1 {
  transform: matrix(1, -0.3, 0, 1, 0, 0);
}

div#myDiv2 {
  transform: matrix(1, 0, 0.5, 1, 150, 0);
}
</style>
</head>
<body>

<h1>The matrix() Method</h1>

<p>The matrix() method combines all the 2D transform methods into one.</p>

<div>
This a normal div element.
</div>

<div id="myDiv1">
Using the matrix() method.
</div>

<div id="myDiv2">
Another use of the matrix() method.
</div>

</body>
</html>

CSS Transform Properties

:ﺪﻨﮐ ﯽﻣ ﺖﺳﺮﻬﻓ ﺍﺭ ﯼﺪﻌﺑ 2 ﻞﯾﺪﺒﺗ ﯼﺎﻫ ﯽﮔﮋﯾﻭ ﻡﺎﻤﺗ ﺮﯾﺯ ﻝﻭﺪﺟ

transform

ﺪﻨﮐ ﯽﻣ ﻝﺎﻤﻋﺍ ﺮﺼﻨﻋ ﮏﯾ ﻪﺑ ﺍﺭ ﯼﺪﻌﺑ ﻪﺳ ﺎﯾ ﯼﺪﻌﺑ ﻭﺩ ﻞﯾﺪﺒﺗ ﮏﯾ

transform-origin

ﺪﯿﻫﺩ ﺮﯿﯿﻐﺗ ﺍﺭ ﻩﺪﺷ ﻞﯾﺪﺒﺗ ﺮﺻﺎﻨﻋ ﺖﯿﻌﻗﻮﻣ ﺪﻫﺩ ﯽﻣ ﻥﺎﮑﻣﺍ ﺎﻤﺷ ﻪﺑ

CSS 2D Transform Methods

matrix(n,n,n,n,n,n)

ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺭﺍﺪﻘﻣ ﺶﺷ ﺯﺍ ﯽﺴﯾﺮﺗﺎﻣ ﺯﺍ ﻩﺩﺎﻔﺘﺳﺍ ﺎﺑ ﺍﺭ ﯼﺪﻌﺑﻭﺩ ﻞﯾﺪﺒﺗ ﮏﯾ

translate(x,y)

ﺪﻫﺩ ﯽﻣ ﺖﮐﺮﺣ Y ﻭ X ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﺍﺭ ﺮﺼﻨﻋ ﻭ ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑﻭﺩ ﻪﻤﺟﺮﺗ ﮏﯾ

translateX(n)

ﺪﻫﺩ ﯽﻣ ﺖﮐﺮﺣ X ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﺍﺭ ﺮﺼﻨﻋ ﻭ ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑ ﻭﺩ ﻪﻤﺟﺮﺗ ﮏﯾ

translateY(n)

ﺪﻫﺩ ﯽﻣ ﺖﮐﺮﺣ Y ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﺍﺭ ﺮﺼﻨﻋ ﻭ ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑ ﻭﺩ ﻪﻤﺟﺮﺗ ﮏﯾ

scale(x,y)

ﺪﻫﺩ ﯽﻣ ﺮﯿﯿﻐﺗ ﺍﺭ ﺮﺻﺎﻨﻋ ﻉﺎﻔﺗﺭﺍ ﻭ ﺽﺮﻋ ﻭ ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑ 2 ﺱﺎﯿﻘﻣ ﻞﯾﺪﺒﺗ

scaleX(n)

ﺪﻫﺩ ﯽﻣ ﺮﯿﯿﻐﺗ ﺍﺭ ﺮﺼﻨﻋ ﺽﺮﻋ ﻭ ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑﻭﺩ ﺱﺎﯿﻘﻣ ﻞﯾﺪﺒﺗ

scaleY(n)

ﺪﻫﺩ ﯽﻣ ﺮﯿﯿﻐﺗ ﺍﺭ ﺮﺼﻨﻋ ﻉﺎﻔﺗﺭﺍ ﻭ ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑ ﻭﺩ ﺱﺎﯿﻘﻣ ﻞﯾﺪﺒﺗ

rotate(angle)

ﺩﻮﺷ ﯽﻣ ﺺﺨﺸﻣ ﺮﺘﻣﺍﺭﺎﭘ ﺭﺩ ﻪﯾﻭﺍﺯ ،ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑ 2 ﺶﺧﺮﭼ

skew(x-angle,y-angle)

ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ Y ﻭ X ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﺍﺭ ﯼﺪﻌﺑﻭﺩ ﯽﻓﺍﺮﺤﻧﺍ ﻞﯾﺪﺒﺗ ﮏﯾ

skewX(angle)

ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ X ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﺍﺭ ﯼﺪﻌﺑ ﻭﺩ ﺞﮐ ﻞﯾﺪﺒﺗ ﮏﯾ

skewY(angle)

ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ Y ﺭﻮﺤﻣ ﺩﺍﺪﺘﻣﺍ ﺭﺩ ﺍﺭ ﯼﺪﻌﺑ ﻭﺩ ﺞﮐ ﻞﯾﺪﺒﺗ ﮏﯾ

تمامی حقوق محفوظ است. © BasicIT.org • 2023-2024