{"id":1858,"date":"2020-11-09T08:49:38","date_gmt":"2020-11-09T05:19:38","guid":{"rendered":"https:\/\/zoghismh.ir\/?page_id=1858"},"modified":"2021-04-05T16:03:24","modified_gmt":"2021-04-05T11:33:24","slug":"part6","status":"publish","type":"page","link":"https:\/\/zoghismh.ir\/?page_id=1858","title":{"rendered":"\u06f6- \u0628\u0627\u06a9\u0633\u06cc\u0646\u06af"},"content":{"rendered":"

\u0645\u0642\u062f\u0645\u0647<\/span><\/h4>\n

\u062f\u0631 \u0627\u06cc\u0646 \u0641\u0635\u0644 \u0645\u06cc\u200c\u062e\u0648\u0627\u0647\u06cc\u0645 \u062f\u0631 \u0645\u0648\u0631\u062f \u0645\u0641\u0647\u0648\u0645 \u0628\u0633\u06cc\u0627\u0631 \u0645\u0647\u0645 \u0648 \u067e\u0631\u06a9\u0627\u0631\u0628\u0631\u062f\u06cc \u062f\u0631 css<\/strong> <\/span>\u06a9\u0647 \u0627\u0635\u0637\u0644\u0627\u062d\u0627\u064b \u0628\u0647 \u0622\u0646 Box Sizing<\/strong><\/span> \u0645\u06cc\u200c\u06af\u0648\u06cc\u0646\u062f\u060c \u0635\u062d\u0628\u062a \u06a9\u0646\u06cc\u0645.<\/p>\n

\u0627\u06af\u0631 \u0628\u0647 \u06cc\u0627\u062f \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f \u062f\u0631 \u0627\u0648\u0627\u062e\u0631 \u0645\u0637\u0627\u0644\u0628 \u0641\u0635\u0644 \u0642\u0628\u0644 \u0645\u0648\u0636\u0648\u0639\u06cc \u0628\u0627 \u0639\u0646\u0648\u0627\u0646 \u0628\u0627\u06a9\u0633\u06cc\u0646\u06af \u062f\u0627\u0634\u062a\u06cc\u0645. \u062f\u0631 \u0622\u0646\u062c\u0627 \u0628\u06cc\u0627\u0646 \u06a9\u0631\u062f\u06cc\u0645:<\/p>\n

<\/p>\n

\u0647\u0631 \u0627\u0650\u0644\u0645\u0646\u062a<\/strong> \u06a9\u0647 \u062f\u0631 html<\/strong> \u0628\u0647 \u06a9\u0627\u0631 \u0645\u06cc\u200c\u0631\u0648\u062f \u0631\u0627 \u062f\u0631 \u06cc\u06a9\u00a0\u0642\u0627\u0628<\/strong><\/span> \u0645\u062c\u0632\u0627 \u0627\u0632 \u0647\u0645 \u062f\u0631 \u0646\u0638\u0631 \u0628\u06af\u06cc\u0631\u06cc\u062f\u061b \u0628\u0639\u062f \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u0622\u0646 \u0631\u0627 \u0628\u0631\u0631\u0633\u06cc \u06a9\u0631\u062f\u06cc\u0645.<\/p>\n

\u06cc\u0639\u0646\u06cc \u06a9\u0627\u0646\u062a\u0650\u0646\u062a content<\/strong> (\u0645\u062d\u062a\u0648\u0627) \u0645\u0627 \u062f\u0627\u0631\u0627\u06cc \u067e\u0647\u0646\u0627 \u0648 \u0628\u0644\u0646\u062f\u06cc \u0645\u06cc\u200c\u0628\u0627\u0634\u062f\u061b
\n\u062f\u0631 \u0645\u062b\u0627\u0644 \u0632\u06cc\u0631 \u062a\u0635\u0648\u06cc\u0631 \u06a9\u0647 \u062f\u0631 \u062a\u06af img \u0622\u0645\u062f\u0647 \u0627\u0633\u062a \u0686\u0646\u06cc\u0646 \u062e\u0635\u0648\u0635\u06cc\u062a\u06cc \u062f\u0627\u0631\u062f.<\/p>\n

\"\"<\/p>\n

\u0628\u0627 \u062a\u0648\u062c\u0647 \u0628\u0647 \u0627\u06cc\u0646 \u0648\u06cc\u0698\u06af\u06cc \u06cc\u0639\u0646\u06cc \u0647\u0631 \u0627\u0650\u0644\u0645\u0646\u062a \u062f\u0627\u0631\u0627\u06cc \u062e\u0635\u0648\u0635\u06cc\u0627\u062a \u0645\u0646\u062d\u0635\u0631 \u0628\u0647 \u0641\u0631\u062f\u06cc \u0645\u0627\u0646\u0646\u062f \u067e\u0647\u0646\u0627\u060c \u0628\u0644\u0646\u062f\u06cc (\u0627\u0631\u062a\u0641\u0627\u0639) \u062e\u0627\u0635 \u062e\u0648\u062f\u0634 \u0645\u06cc\u200c\u0628\u0627\u0634\u062f \u0648 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646 \u0622\u0646 \u0631\u0627 \u062a\u0639\u06cc\u06cc\u0646 \u06a9\u0631\u062f.<\/p>\n

\u0628\u0627\u06a9\u0633 \u0633\u0627\u06cc\u0632\u06cc\u0646\u06af\u00a0 \u00a0 \u00a0Box Sizing<\/strong><\/span><\/h3>\n
\n

Box Sizing \u062f\u0631 CSS \u0628\u0647 \u062a\u0639\u06cc\u06cc\u0646 \u0627\u0646\u062f\u0627\u0632\u0647 \u0627\u0644\u0645\u0646\u062a\u200c\u0647\u0627\u060c \u06af\u0641\u062a\u0647 \u0645\u06cc\u200c\u0634\u0648\u062f.<\/p>\n<\/blockquote>\n

\u0634\u0627\u0645\u0644 margin \u0647\u0627\u060c border \u0647\u0627 \u060c padding \u0648 \u0645\u062d\u062a\u0648\u0627\u06cc \u0639\u0646\u0635\u0631 \u0627\u0633\u062a.
\n<\/strong>\u062f\u0631 \u062a\u0635\u0648\u06cc\u0631 \u0632\u06cc\u0631 \u0645\u0641\u0647\u0648\u0645 \u0622\u0646 \u0628\u06cc\u0627\u0646 \u0634\u062f\u0647 \u0627\u0633\u062a :<\/p>\n

\"\"<\/p>\n

\u06a9\u0627\u0646\u062a\u0650\u0646\u062a content:<\/span><\/strong> \u0645\u062d\u062a\u0648\u0627\u06cc box\u060c \u062c\u0627\u06cc\u06cc \u06a9\u0647 \u0645\u062a\u0648\u0646 \u0648 \u062a\u0635\u0627\u0648\u06cc\u0631 \u0642\u0631\u0627\u0631 \u0645\u06cc\u200c\u06af\u06cc\u0631\u0646\u062f.
\n\u067e\u064e\u062f\u06cc\u0646\u06af padding:<\/span> <\/strong>\u062d\u0627\u0634\u06cc\u0647 \u062f\u0631\u0648\u0646\u06cc
\n\u0628\u064f\u0631\u062f\u0650\u0631\u00a0 \u00a0 \u00a0border:<\/span><\/strong> \u062e\u0637 \u06cc\u0627 \u0646\u0648\u0627\u0631 \u0645\u0631\u0632\u06cc
\n\u0645\u0627\u0631\u062c\u06cc\u0646\u00a0 margin:<\/span><\/strong> \u062d\u0627\u0634\u06cc\u0647 \u0628\u06cc\u0631\u0648\u0646\u06cc<\/p>\n

\n

\u0628\u064f\u0631\u062f\u0650\u0631\u00a0 \u00a0border<\/strong><\/span><\/h3>\n

\"\"<\/p>\n

\u062e\u0637 \u06cc\u0627 \u0646\u0648\u0627\u0631 \u0645\u0631\u0632\u06cc \u0627\u0633\u062a. <\/strong><\/span>\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u06cc\u0646 \u0648\u06cc\u0698\u06af\u06cc \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0627\u0633\u062a\u0627\u06cc\u0644(\u0646\u0648\u0639 \u06cc\u0627 \u0633\u0628\u06a9)\u060c \u067e\u0647\u0646\u0627 \u0648 \u0631\u0646\u06af \u062e\u0637 \u06cc\u0627 \u0646\u0648\u0627\u0631 \u0645\u0631\u0632\u06cc (border) \u0627\u0632 \u06cc\u06a9 \u0627\u0650\u0644\u0645\u0646\u062a \u0631\u0627 \u062a\u0639\u06cc\u06cc\u0646 \u06a9\u0646\u06cc\u062f.<\/p>\n

\u0628\u064f\u0631\u062f\u0631 \u0627\u0633\u062a\u0627\u06cc\u0644\u00a0 \u00a0 \u00a0B<\/strong><\/span>order <\/strong><\/span>Style<\/strong><\/span><\/h3>\n

\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u062f\u0633\u062a\u0648\u0631 css \u06cc\u0639\u0646\u06cc border-style<\/strong><\/span> \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0645\u0642\u0627\u062f\u06cc\u0631 \u0632\u06cc\u0631 \u0631\u0627 \u0628\u0647 \u0622\u0646 \u0627\u062e\u062a\u0635\u0627\u0635 \u062f\u0647\u06cc\u062f.<\/p>\n

solid, dashed, dotted, double, groove, ridge, inset, outset, none<\/p>\n

<\/p>\n

img {\r\n  border-style: solid;\r\n}<\/code><\/pre>\n
<\/p>\n
<\/h3>\n
\u0628\u064f\u0631\u062f\u0650\u0631 \u0648\u06cc\u062f\u062b\u00a0 \u00a0 \u00a0 <\/strong><\/span>Border Width<\/strong><\/span><\/h3>\n
<\/h4>\n
\u062f\u0633\u062a\u0648\u0631 css \u0622\u0646 \u0645\u0637\u0627\u0628\u0642 \u0632\u06cc\u0631 \u0645\u06cc\u200c\u0628\u0627\u0634\u062f:<\/p>\n
border-width :\u00a0 value<\/span><\/strong><\/span> ;<\/span><\/strong><\/h5>\n
\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0622\u0646 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0636\u062e\u0627\u0645\u062a (\u067e\u0647\u0646\u0627)\u00a0<\/strong>\u0628\u064f\u0631\u062f\u0650\u0631 \u0631\u0627 \u062a\u0639\u06cc\u06cc\u0646 \u06a9\u0646\u06cc\u062f.<\/p>\n
<\/p>\n
img {\r\n  border-style: solid;\r\n  border-width: 20px;\r\n}<\/code><\/pre>\n
<\/p>\n
<\/h3>\n
\u0628\u064f\u0631\u062f\u0650\u0631 \u06a9\u0627\u0644\u0650\u0631\u00a0 \u00a0<\/strong><\/span>Border\u00a0 Color<\/strong><\/span><\/h3>\n
\u062f\u0633\u062a\u0648\u0631 css \u0622\u0646 \u0645\u0637\u0627\u0628\u0642 \u0632\u06cc\u0631 \u0645\u06cc\u200c\u0628\u0627\u0634\u062f:<\/p>\n
border-color :\u00a0 value<\/span><\/strong><\/span> ;<\/span><\/strong><\/h5>\n
\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0622\u0646 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0631\u0646\u06af \u0628\u064f\u0631\u062f\u0650\u0631 \u0631\u0627 \u062a\u0639\u06cc\u06cc\u0646<\/strong> \u06a9\u0646\u06cc\u062f.<\/p>\n
<\/p>\n
img {\r\n  border-style: solid;\r\n  border-width: 20px;\r\n  border-color: #ff8000;\r\n}<\/code><\/pre>\n
<\/p>\n
\u0627\u06af\u0631 \u0628\u062e\u0648\u0627\u0647\u06cc\u0645 \u0628\u0647 \u0635\u0648\u0631\u062a \u062e\u0644\u0627\u0635\u0647 \u0648 \u06a9\u0648\u062a\u0627\u0647 \u062f\u0633\u062a\u0648\u0631 border<\/strong> \u0631\u0627 \u0628\u0646\u0648\u06cc\u0633\u06cc\u0645 \u0628\u062f\u06cc\u0646 \u0635\u0648\u0631\u062a \u0628\u0627\u06cc\u062f \u0639\u0645\u0644 \u06a9\u0631\u062f:<\/p>\n
\n
border:\u00a0<\/strong><\/span>width <\/span>style <\/span>color;<\/span><\/h4>\n
\n
\u06cc\u0639\u0646\u06cc \u0628\u0639\u062f \u0627\u0632 \u06a9\u0644\u0645\u0647 border<\/span> \u0628\u0647 \u062a\u0631\u062a\u06cc\u0628 \u0645\u0642\u062f\u0627\u0631 \u067e\u0647\u0646\u0627<\/span>\u060c \u0633\u0628\u06a9<\/span> \u0648 \u0631\u0646\u06af<\/span> \u0631\u0627 \u0628\u0627\u06cc\u062f \u0646\u0648\u0634\u062a.<\/strong><\/p>\n<\/div>\n
<\/p>\n
img {\r\n  border: 20px solid #ff8000;\r\n}\r\n<\/code><\/pre>\n

\n
\n
\u0628\u064f\u0631\u062f\u0650\u0631 \u0631\u0627\u0646\u062f\u0650\u062f\u00a0 \u00a0<\/strong>Border Rounded<\/strong><\/span><\/h3>\n
\u062f\u0633\u062a\u0648\u0631 \u062c\u0627\u0644\u0628 \u062f\u06cc\u06af\u0631\u06cc \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f \u06a9\u0647 \u062a\u0648\u0633\u0637 \u0622\u0646 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u06af\u0648\u0634\u0647\u200c\u0647\u0627 \u0631\u0627 \u06af\u0631\u062f<\/strong> \u06a9\u0646\u06cc\u062f!<\/p>\n
border-radius :\u00a0 value<\/span><\/strong><\/span> ;<\/span><\/strong><\/h5>\n
<\/p>\n
img {\r\n  border-radius: 50px;\r\n}<\/code><\/pre>\n
<\/p>\n
<\/p>\n
img {\r\n  border-radius: 50%;\r\n}<\/code><\/pre>\n
<\/p>\n
\n
\u062a\u0645\u0631\u06cc\u0646 \u06f1<\/strong><\/span><\/h3>\n
\u0628\u0631\u0627\u06cc \u062a\u0645\u0631\u06cc\u0646 \u0648 \u062f\u0631\u06a9 \u0628\u0647\u062a\u0631 \u0648\u06cc\u0698\u06af\u06cc \u06af\u0641\u062a\u0647 \u0634\u062f\u0647 \u0627\u06cc\u0646 \u062a\u0635\u0648\u06cc\u0631 \u0631\u0627 \u062f\u0627\u0646\u0644\u0648\u062f<\/a> \u06a9\u0646\u06cc\u062f \u0648 \u062f\u0633\u062a\u0648\u0631\u00a0 ;border-radius:<\/span> 50%<\/strong><\/span>\u00a0 \u0648\u00a0 ;border-radius:<\/span> 50px <\/strong><\/span>\u0631\u0627 \u0628\u0627\u0647\u0645 \u0645\u0642\u0627\u06cc\u0633\u0647 \u06a9\u0646\u06cc\u062f!
\n\u0622\u06cc\u0627 \u062f\u0631 \u062e\u0631\u0648\u062c\u06cc \u0627\u06cc\u0646 \u062f\u0648 \u062a\u0635\u0648\u06cc\u0631 \u062a\u0641\u0627\u0648\u062a\u06cc \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f\u061f \u0686\u0631\u0627\u061f<\/p>\n
\"\"<\/p>\n
<\/h3>\n
\u067e\u064e\u062f\u06cc\u0646\u06af\u00a0 \u00a0 <\/strong><\/span>Padding<\/strong><\/span><\/h3>\n
\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u06cc\u0646 \u0648\u06cc\u0698\u06af\u06cc \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u062d\u0627\u0634\u06cc\u0647 \u062f\u0631\u0648\u0646\u06cc <\/strong>\u0627\u0650\u0644\u0645\u0646\u062a \u062a\u0627 \u0628\u064f\u0631\u062f\u0650\u0631<\/span> \u0631\u0627 \u0645\u0634\u062e\u0635 \u06a9\u0646\u06cc\u062f.<\/span><\/p>\n
<\/p>\n
img {\r\n  padding: 50px;\r\n}<\/code><\/pre>\n

\n
\u0645\u0627\u0631\u062c\u06cc\u0646\u00a0 \u00a0 \u00a0 Margin<\/strong><\/span><\/h3>\n
\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u06cc\u0646 \u0648\u06cc\u0698\u06af\u06cc \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u062d\u0627\u0634\u06cc\u0647 \u0628\u06cc\u0631\u0648\u0646\u06cc <\/strong>\u0627\u0650\u0644\u0645\u0646\u062a \u062a\u0627 \u0628\u064f\u0631\u062f\u0650\u0631<\/span> \u0631\u0627 \u0645\u0634\u062e\u0635 \u06a9\u0646\u06cc\u062f.<\/span><\/p>\n
<\/p>\n
img {\r\n  margin: 20px;\r\n}<\/code><\/pre>\n
<\/p>\n
<\/div>\n
\u0628\u0631\u0627\u06cc \u062f\u0631\u06a9 \u0628\u0647\u062a\u0631 \u06f2 \u0648\u06cc\u0698\u06af\u06cc \u0628\u0627\u0644\u0627 \u062d\u062a\u0645\u0627\u064b \u0627\u0632 \u0627\u0628\u0632\u0627\u0631 Inspect Element<\/a> \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f.<\/div>\n
<\/div>\n
https:\/\/zoghismh.ir\/wp-content\/uploads\/2020\/11\/Inspect-Element.mp4<\/a><\/video><\/div>\n
Box Sizing<\/strong><\/span><\/h3>\n
\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0648\u06cc\u0698\u06af\u06cc box-sizing \u062f\u0631 CSS \u0645\u06cc\u200c\u062a\u0648\u0627\u0646 \u0645\u0634\u062e\u0635 \u06a9\u0631\u062f \u06a9\u0647 \u0622\u06cc\u0627 \u0627\u0646\u062f\u0627\u0632\u0647 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc Border \u0648 Padding \u0628\u0647 \u0631\u0648\u06cc \u0627\u0646\u062f\u0627\u0632\u0647 \u067e\u0647\u0646\u0627 (width)<\/span> \u0648 \u0627\u0631\u062a\u0641\u0627\u0639 (height)<\/span> \u06cc\u06a9 \u0627\u0650\u0644\u0645\u0646\u062a \u062a\u0627\u062b\u06cc\u0631 \u0628\u06af\u0630\u0631\u0627\u0646\u062f \u06cc\u0627 \u062e\u06cc\u0631\u061f<\/p>\n
\u0632\u0645\u0627\u0646\u06cc\u200c\u06a9\u0647 \u0634\u0645\u0627 \u0645\u0642\u062f\u0627\u0631\u06cc \u0628\u0647 \u0648\u06cc\u0698\u06af\u06cc box-sizing<\/strong> \u0646\u062f\u0647\u06cc\u062f\u060c \u0645\u0642\u062f\u0627\u0631 \u067e\u06cc\u0634\u0641\u0631\u0636 \u0628\u0647 \u0627\u06cc\u0646 \u0635\u0648\u0631\u062a \u0639\u0645\u0644 \u0645\u06cc\u200c\u06a9\u0646\u062f \u06a9\u0647 \u067e\u0647\u0646\u0627 \u0648 \u0627\u0631\u062a\u0641\u0627\u0639\u06cc \u06a9\u0647 \u0628\u0647 \u0627\u0650\u0644\u0645\u0646\u062a \u0645\u06cc\u200c\u062f\u0647\u06cc\u062f\u060c \u0627\u06cc\u0646 \u067e\u0647\u0646\u0627 \u0648 \u0627\u0631\u062a\u0641\u0627\u0639 \u0645\u0631\u0628\u0648\u0637 \u0628\u0647 \u0645\u062d\u062a\u0648\u0627\u06cc \u0622\u0646 \u0627\u0650\u0644\u0645\u0646\u062a \u0648 \u0642\u0633\u0645\u062a padding \u06cc\u0627 border \u00a0\u0627\u0650\u0644\u0645\u0646\u062a \u0631\u0627 \u0634\u0627\u0645\u0644 \u0646\u0645\u06cc\u200c\u0634\u0648\u062f.<\/p>\n
<\/p>\n
p {\r\n  Width: 100px;\r\n  Height: 100px;\r\n  Padding: 10px;\r\n  border: 5px solid blue;\r\n  background-color: red;\r\n}<\/code><\/pre>\n
\u062f\u0631 \u0645\u062b\u0627\u0644 \u0628\u0627\u0644\u0627 \u0645\u0642\u062f\u0627\u0631 \u06f1\u06f0\u06f0 \u067e\u06cc\u06a9\u0633\u0644 \u0645\u0631\u0628\u0648\u0637 \u0628\u0647 \u067e\u0647\u0646\u0627 \u0648 \u0627\u0631\u062a\u0641\u0627\u0639 \u0627\u0650\u0644\u0645\u0646\u062a \u0648 \u0634\u0627\u0645\u0644 \u0642\u0633\u0645\u062a padding \u0646\u0645\u06cc \u0634\u0648\u062f. (\u062f\u0631 \u0645\u062d\u06cc\u0637 Inspect Element \u0628\u0631\u0631\u0633\u06cc \u06a9\u0646\u06cc\u062f<\/span>)
\n\u06cc\u0639\u0646\u06cc \u0645\u062c\u0645\u0648\u0639 \u0641\u0636\u0627\u06cc\u06cc \u06a9\u0647 \u0627\u06cc\u0646 \u0627\u0650\u0644\u0645\u0646\u062a \u0627\u0634\u063a\u0627\u0644 \u0645\u06cc\u200c\u06a9\u0646\u062f\u060c \u06f1\u06f2\u06f0 \u067e\u06cc\u06a9\u0633\u0644 \u067e\u0647\u0646\u0627 \u0648 \u06f1\u06f2\u06f0 \u067e\u06cc\u06a9\u0633\u0644 \u0627\u0631\u062a\u0641\u0627\u0639 \u0627\u0633\u062a.
\n\u0627\u06af\u0631 \u0628\u062e\u0648\u0627\u0647\u0645 \u0648\u0627\u0636\u062d\u200c\u062a\u0631 \u0628\u06cc\u0627\u0646 \u06a9\u0646\u0645\u060c \u0627\u0650\u0644\u0645\u0646\u062a \u067e\u0647\u0646\u0627 \u0648 \u0627\u0631\u062a\u0641\u0627\u0639 \u06f1\u06f0\u06f0 \u067e\u06cc\u06a9\u0633\u0644\u06cc \u062e\u0648\u062f\u0634 \u0631\u0627 \u062d\u0641\u0638 \u06a9\u0631\u062f\u0647 \u0648 \u0645\u0642\u0627\u062f\u06cc\u0631 padding \u0631\u0627 \u0627\u0632 \u0647\u0631 \u0686\u0647\u0627\u0631 \u0637\u0631\u0641 \u0628\u0647 \u067e\u0647\u0646\u0627 \u0648 \u0627\u0631\u062a\u0641\u0627\u0639 \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc\u200c\u06a9\u0646\u062f.<\/p>\n
\u062f\u0631 \u0645\u062b\u0627\u0644 \u0632\u06cc\u0631 \u0628\u0627 \u0627\u06cc\u0646\u200c\u06a9\u0647 \u067e\u0647\u0646\u0627 \u0648 \u0627\u0631\u062a\u0641\u0627\u0639 \u062f\u0627\u062f\u0647 \u0634\u062f\u0647 \u06f1\u06f0\u06f0 \u067e\u06cc\u06a9\u0633\u0644 \u0627\u0633\u062a \u0648\u0644\u06cc \u0641\u0642\u0637 \u06f7\u06f0 \u067e\u06cc\u06a9\u0633\u0644 \u0627\u0632 \u0642\u0633\u0645\u062a \u0627\u0634\u063a\u0627\u0644 \u0634\u062f\u0647\u060c \u0645\u0631\u0628\u0648\u0637 \u0628\u0647 \u0645\u062d\u062a\u0648\u0627\u06cc \u0627\u0650\u0644\u0645\u0646\u062a \u0645\u06cc\u200c\u0628\u0627\u0634\u062f\u061b
\n\u0686\u0648\u0646 \u06f2\u06f0 \u067e\u06cc\u06a9\u0633\u0644 (\u06f1\u06f0 \u067e\u06cc\u06a9\u0633\u0644 \u0627\u0632 \u0647\u0631 \u0637\u0631\u0641) \u0645\u0631\u0628\u0648\u0637 \u0628\u0647 padding \u0627\u0650\u0644\u0645\u0646\u062a \u0648 \u06f5 \u067e\u06cc\u06a9\u0633\u0644 \u0627\u0632 \u0647\u0631 \u0637\u0631\u0641 \u0645\u0631\u0628\u0648\u0637 \u0628\u0647 border \u0627\u0650\u0644\u0645\u0646\u062a \u06a9\u0647 \u062f\u0631 \u0645\u062c\u0645\u0648\u0639 \u0645\u06cc\u200c\u0634\u0648\u062f\u06f3\u06f0 \u067e\u06cc\u06a9\u0633\u0644.<\/p>\n
p {\r\n  Width: 100px;\r\n  Height: 100px;\r\n  Padding: 10px;\r\n  border: 5px solid blue;\r\n  background-color: red;\r\n  box-sizing: border-box;\r\n}<\/code><\/pre>\n
\"\"
\u062e\u0644\u0627\u0635\u0647 \u0646\u06a9\u0627\u062a \u0628\u0627\u0644\u0627 \u0631\u0627 \u062f\u0631 \u0627\u06cc\u0646 \u062a\u0635\u0648\u06cc\u0631 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0645\u0634\u0627\u0647\u062f\u0647 \u06a9\u0646\u06cc\u062f<\/figcaption><\/figure>\n
CSS Selector\u00a0 \u00a0 \u00a0\u0633\u0650\u0644\u06a9\u062a\u0648\u0631\u200c \u0633\u06cc\u200c\u0627\u0633 \u0627\u0633
\n<\/strong><\/span><\/h3>\n
\u06f1- <\/span>\u0627\u064e\u0633\u0652\u062a\u0650\u0631\u06a9\u0633\u00a0 Asterisk<\/span>
\n<\/span><\/h4>\n
\u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u06cc\u0646 \u0633\u0644\u06a9\u062a\u0648\u0631 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0631\u0648\u06cc \u0647\u0645\u0647\u200c\u06cc<\/strong><\/span> \u0627\u0650\u0644\u0645\u0646\u062a\u200c\u0647\u0627 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc\u06cc \u0627\u0639\u0645\u0627\u0644 \u06a9\u0646\u06cc\u062f. \u0628\u0631\u0627\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u06cc\u0646 \u0627\u0650\u0644\u0645\u0646\u062a \u0627\u0632 \u0639\u0644\u0627\u0645\u062a<\/span> * <\/strong>\u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc\u200c\u0634\u0648\u062f.\u00a0<\/span><\/p>\n
\n
\u067e\u06cc\u0634\u0641\u0631\u0636 \u0645\u0631\u0648\u0631\u06af\u0631\u0647\u0627 \u0645\u062a\u0641\u0627\u0648\u062a \u0627\u0633\u062a!
\n\u062c\u0647\u062a \u0627\u0632 \u0628\u06cc\u0646 \u0628\u0631\u062f\u0646 \u0627\u06cc\u0646 \u067e\u06cc\u0634\u0641\u0631\u0636\u200c\u0647\u0627 \u0633\u0647 \u062f\u0633\u062a\u0648\u0631 \u0632\u06cc\u0631 \u0631\u0627 \u062f\u0631 css \u062e\u0648\u062f \u0628\u0646\u0648\u06cc\u0633\u06cc\u062f.<\/p>\n<\/div>\n
* {\r\n  margin:0;\r\n  padding:0;\r\n  box-sizing: border-box;\r\n}<\/code><\/pre>\n
\u0628\u0631\u0627\u06cc \u062e\u0648\u062f\u062a\u0627\u0646 \u062a\u062d\u0644\u06cc\u0644 \u06a9\u0646\u06cc\u062f \u0633\u0647 \u062f\u0633\u062a\u0648\u0631 css \u0628\u0627\u0644\u0627 \u0686\u0647 \u06a9\u0627\u0631\u06cc \u0627\u0646\u062c\u0627\u0645 \u0645\u06cc\u200c\u062f\u0647\u062f.<\/p>\n
\u062a\u0645\u0631\u06cc\u0646 \u06f2<\/h3>\n
\u0627\u06cc\u0646 \u0631\u0627 \u062f\u0627\u0646\u0644\u0648\u062f<\/a> \u06a9\u0646\u06cc\u062f \u0648 css\u00a0 \u0631\u0627 \u0628\u0647 \u06af\u0648\u0646\u0647\u200c \u0632\u06cc\u0631 \u062a\u063a\u06cc\u06cc\u0631 \u062f\u0647\u06cc\u062f:<\/h4>\n
    \n
  1. \u0641\u0648\u0627\u0635\u0644 \u067e\u06cc\u0634\u0641\u0631\u0636\u200c\u0647\u0627\u06cc \u0645\u0631\u0648\u0631\u06af\u0631 \u0631\u0627 \u0635\u0641\u0631 \u06a9\u0646\u06cc\u062f!<\/li>\n
  2. \u062f\u0648\u0631 \u0639\u0628\u0627\u0631\u062a “\u0645\u0646\u0638\u0648\u0645\u0647 \u0634\u0645\u0633\u06cc” \u062d\u0627\u0634\u06cc\u0647\u200c\u0627\u06cc \u0628\u06cc\u0627\u0646\u062f\u0627\u0632\u06cc\u062f.<\/li>\n
  3. \u062f\u0648\u0631 \u0639\u06a9\u0633 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0634\u062f\u0647 \u062f\u0631 \u0633\u0627\u06cc\u062a\u200c\u062a\u0627\u0646 \u0631\u0648 \u0628\u0647 \u0627\u0646\u062f\u0627\u0632\u0647 \u06f5\u06f0\u067e\u06cc\u06a9\u0633\u0644 \u06af\u0631\u062f \u06a9\u0646\u06cc\u062f.<\/li>\n
  4. \u0641\u0627\u0635\u0644\u0647\u200c\u0627\u06cc \u062f\u0631 \u0686\u0647\u0627\u0631 \u0637\u0631\u0641 \u0639\u06a9\u0633 \u0628\u0647 \u0627\u0646\u062f\u0627\u0632\u0647 \u06f3\u06f0 \u067e\u06cc\u06a9\u0633\u0644 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f.<\/li>\n
  5. \u062f\u0648\u0631 \u06a9\u0644 \u0646\u0627\u0645\u200c\u0647\u0627\u06cc \u0633\u06cc\u0627\u0631\u0647\u200c\u0647\u0627 \u062d\u0627\u0634\u06cc\u0647\u200c\u0627\u06cc \u0628\u0647 \u0635\u0648\u0631\u062a \u0644\u0628\u0647 \u06af\u0631\u062f \u062a\u0639\u06cc\u06cc\u0646 \u06a9\u0646\u06cc\u062f.<\/li>\n<\/ol>\n
    \u0646\u0645\u0648\u0646\u0647<\/a><\/p>\n
    \u0627\u0646\u062a\u062e\u0627\u0628 \u0631\u0646\u06af\u200c\u0647\u0627\u060c \u0646\u0648\u0639 \u0642\u0644\u0645 \u0648 \u0627\u0646\u062f\u0627\u0632\u0647 \u0628\u0647 \u0633\u0644\u06cc\u0642\u0647 \u062e\u0648\u062f\u062a\u0627\u0646<\/span><\/strong><\/h4>\n
    <\/h3>\n
    \u0631\u0627\u0646\u062f\u00a0 \u00a0 \u00a0Around<\/strong><\/span><\/h1>\n
     <\/p>\n
    <\/p>\n
    img {\r\n  padding-top: 20px;\r\n  padding-right: 30px;\r\n  padding-bottom: 40px;\r\n  padding-left: 50px;\r\n}<\/code><\/pre>\n
    <\/p>\n
    \u0647\u0645\u0627\u0646\u0637\u0648\u0631 \u06a9\u0647 \u062f\u0631 \u0645\u062b\u0627\u0644 \u0628\u0627\u0644\u0627 \u0645\u0634\u0627\u0647\u062f\u0647 \u0645\u06cc\u200c\u06a9\u0646\u06cc\u062f \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646\u06a9\u0647 \u0627\u0646\u062f\u0627\u0632\u0647 padding \u06cc\u0627 margin \u062f\u0631 \u0686\u0647\u0627\u0631 \u0637\u0631\u0641 \u0627\u0650\u0644\u0645\u0646\u062a \u0645\u062a\u0641\u0627\u0648\u062a \u0628\u0627\u0634\u062f \u0628\u0627\u06cc\u062f \u0627\u06cc\u0646 \u0648\u06cc\u0698\u06af\u06cc \u0631\u0627 \u062f\u0631 \u06f4 \u062e\u0637 \u0648 \u0628\u0631\u0627\u06cc \u0647\u0631 \u0633\u0645\u062a (\u0628\u0627\u0644\u0627\u060c \u0631\u0627\u0633\u062a\u060c \u067e\u0627\u06cc\u06cc\u0646\u060c \u0686\u067e) \u0628\u0647 \u0635\u0648\u0631\u062a \u062c\u062f\u0627\u06af\u0627\u0646\u0647 \u0628\u0646\u0648\u06cc\u0633\u06cc\u062f.<\/p>\n
    \u062c\u0647\u062a \u062e\u0644\u0627\u0635\u0647 \u0646\u0648\u06cc\u0633\u06cc \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u0647 \u0635\u0648\u0631\u062a \u0632\u06cc\u0631 \u0639\u0645\u0644 \u06a9\u0646\u06cc\u062f.<\/strong><\/span><\/h5>\n
    T<\/strong> \u0645\u062e\u0641\u0641 top
    \nR<\/strong> \u0645\u062e\u0641\u0641 right
    \nB<\/strong> \u0645\u062e\u0641\u0641 bottom
    \nL<\/strong> \u0645\u062e\u0641\u0641 left<\/p>\n
      \n
    1. padding: T R B L ;<\/li>\n
    2. padding: T RL B ;<\/li>\n
    3. padding: TB RL ;<\/li>\n
    4. padding: TRLB ;<\/li>\n<\/ol>\n
      \u0628\u0631\u0627\u06cc \u062f\u0631\u06a9 \u0648 \u0628\u062e\u0627\u0637\u0631 \u0633\u067e\u0631\u062f\u0646 \u0642\u0627\u0646\u0648\u0646 \u062e\u0644\u0627\u0635\u0647 \u0646\u0648\u06cc\u0633\u06cc \u062f\u0631 \u0627\u06cc\u0646 \u0631\u0648\u0634 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0627\u0632 \u062a\u0635\u0648\u06cc\u0631 \u0632\u06cc\u0631 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f\u061b \u062a\u0631\u062a\u06cc\u0628 \u0646\u0648\u0634\u062a\u0646 \u062f\u0631 \u0622\u0646 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0627\u062f\u0647 \u0634\u062f\u0647 \u0627\u0633\u062a.<\/p>\n
      <\/p>\n
      \n
      \u0628\u0631\u0627\u06cc \u062f\u0631\u06a9 \u0631\u0648\u0634 \u062e\u0644\u0627\u0635\u0647 \u0646\u0648\u06cc\u0633\u06cc \u0628\u0627\u0644\u0627 \u062d\u062a\u0645\u0627\u064b \u062e\u0648\u062f\u062a\u0627\u0646 \u06cc\u06a9 \u0628\u0627\u0631 \u0628\u0631\u0627\u06cc margin \u0648 padding \u0622\u0632\u0645\u0627\u06cc\u0634 \u06a9\u0646\u06cc\u062f\u060c \u0628\u0633\u06cc\u0627\u0631 \u062c\u0627\u0644\u0628 \u0627\u0633\u062a.
      \n\u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0628\u0632\u0627\u0631 Inspect Element \u0628\u0631\u0627\u06cc \u062f\u0631\u06a9 \u0628\u0647\u062a\u0631 \u0645\u0637\u0627\u0644\u0628 \u0646\u06cc\u0632 \u0628\u0633\u06cc\u0627\u0631 \u0645\u0641\u06cc\u062f \u0645\u06cc\u200c\u0628\u0627\u0634\u062f.<\/span><\/p>\n<\/blockquote>\n
      \"\"<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
      \u0645\u0642\u062f\u0645\u0647 \u062f\u0631 \u0627\u06cc\u0646 \u0641\u0635\u0644 \u0645\u06cc\u200c\u062e\u0648\u0627\u0647\u06cc\u0645 \u062f\u0631 \u0645\u0648\u0631\u062f \u0645\u0641\u0647\u0648\u0645 \u0628\u0633\u06cc\u0627\u0631 \u0645\u0647\u0645 \u0648 \u067e\u0631\u06a9\u0627\u0631\u0628\u0631\u062f\u06cc \u062f\u0631 css \u06a9\u0647 \u0627\u0635\u0637\u0644\u0627\u062d\u0627\u064b \u0628\u0647 \u0622\u0646 Box Sizing \u0645\u06cc\u200c\u06af\u0648\u06cc\u0646\u062f\u060c \u0635\u062d\u0628\u062a \u06a9\u0646\u06cc\u0645. \u0627\u06af\u0631 \u0628\u0647 \u06cc\u0627\u062f \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f \u062f\u0631 \u0627\u0648\u0627\u062e\u0631 \u0645\u0637\u0627\u0644\u0628 \u0641\u0635\u0644 \u0642\u0628\u0644 \u0645\u0648\u0636\u0648\u0639\u06cc \u0628\u0627 \u0639\u0646\u0648\u0627\u0646 \u0628\u0627\u06a9\u0633\u06cc\u0646\u06af \u062f\u0627\u0634\u062a\u06cc\u0645. \u062f\u0631 \u0622\u0646\u062c\u0627 \u0628\u06cc\u0627\u0646 \u06a9\u0631\u062f\u06cc\u0645: \u0647\u0631 \u0627\u0650\u0644\u0645\u0646\u062a \u06a9\u0647 \u062f\u0631 html \u0628\u0647 \u06a9\u0627\u0631 \u0645\u06cc\u200c\u0631\u0648\u062f \u0631\u0627 \u062f\u0631 \u06cc\u06a9\u00a0\u0642\u0627\u0628 \u0645\u062c\u0632\u0627 \u0627\u0632 …<\/p>\n","protected":false},"author":1,"featured_media":1861,"parent":756,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"templates\/template-cover.php","meta":{"footnotes":""},"class_list":["post-1858","page","type-page","status-publish","has-post-thumbnail","hentry","entry entry-center"],"_links":{"self":[{"href":"https:\/\/zoghismh.ir\/index.php?rest_route=\/wp\/v2\/pages\/1858","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zoghismh.ir\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/zoghismh.ir\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/zoghismh.ir\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zoghismh.ir\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1858"}],"version-history":[{"count":82,"href":"https:\/\/zoghismh.ir\/index.php?rest_route=\/wp\/v2\/pages\/1858\/revisions"}],"predecessor-version":[{"id":2918,"href":"https:\/\/zoghismh.ir\/index.php?rest_route=\/wp\/v2\/pages\/1858\/revisions\/2918"}],"up":[{"embeddable":true,"href":"https:\/\/zoghismh.ir\/index.php?rest_route=\/wp\/v2\/pages\/756"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/zoghismh.ir\/index.php?rest_route=\/wp\/v2\/media\/1861"}],"wp:attachment":[{"href":"https:\/\/zoghismh.ir\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1858"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}