<\/a><\/p>\n\u0648 \u0627\u0645\u0627 \u0622\u0645\u0648\u0632\u0634 :<\/p>\n
\u0627\u0628\u062a\u062f\u0627 \u06a9\u062f html \u0632\u06cc\u0631 \u0631\u0627 \u062f\u0631 \u0648\u0628 \u0633\u0627\u06cc\u062a \u062e\u0648\u062f \u0642\u0631\u0627\u0631 \u062f\u0627\u062f\u0647 :<\/p>\n
<div class=\"loz-vms-block\">\r\n <div class=\"loz-vms-row\">\r\n <div class=\"loz-vms-wrap\">\r\n <\/div>\r\n <\/div>\r\n <div class=\"loz-vms-row\">\r\n <a href=\"http:\/\/xn--mgbguh09aqiwi.com\" class=\"loz-vms-wrap\">\r\n <div class=\"overlay\">\r\n <div class=\"overlay-content\">\r\n Portfolio\r\n <\/div>\r\n <\/div>\r\n <\/a> <a href=\"http:\/\/xn--mgbguh09aqiwi.com\" class=\"loz-vms-wrap\">\r\n <div class=\"overlay\">\r\n <div class=\"overlay-content\">\r\n About\r\n <\/div>\r\n <\/div>\r\n <\/a>\r\n <\/div>\r\n <div class=\"loz-vms-row\">\r\n <a href=\"http:\/\/xn--mgbguh09aqiwi.com\" class=\"loz-vms-wrap polygon-clip-rhombus\">\r\n <div class=\"overlay\">\r\n <div class=\"overlay-content\">\r\n Contact\r\n <\/div>\r\n <\/div>\r\n <\/a>\r\n <\/div>\r\n<\/div>\r\n\r\n <svg class=\"vms-svg\">\r\n <defs>\r\n <clipPath id=\"clip-diamond-demo\" clipPathUnits=\"objectBoundingBox\">\r\n <polygon points=\"0.5 0, 1 0.5, 0.5 1, 0 0.5\" \/>\r\n <\/clipPath>\r\n <\/defs> \r\n <\/svg><\/pre>\n\u062d\u0627\u0644 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u062f\u0631 css \u0633\u0627\u06cc\u062a \u062e\u0648\u062f \u06a9\u067e\u06cc \u06a9\u0646\u06cc\u062f :<\/p>\n
.vms-svg {\r\n\twidth: 0;\r\n\theight: 0;\r\n}\r\n.loz-vms-row {\r\n\ttext-align: center;\r\n}\r\n.loz-vms-row:first-of-type .loz-vms-wrap {\r\n\tbackground-position: top;\r\n}\r\n.loz-vms-row:nth-of-type(2) .loz-vms-wrap:nth-of-type(odd) {\r\n\tbackground-position: left;\r\n}\r\n.loz-vms-row:nth-of-type(2) .loz-vms-wrap:nth-of-type(even) {\r\n\tbackground-position: right;\r\n}\r\n.loz-vms-row:last-of-type .loz-vms-wrap {\r\n\tbackground-position: bottom;\r\n}\r\n.loz-vms-wrap {\r\n\twidth: 300px;\r\n\theight: 300px;\r\n\tbackground-image: url(images\/bg_vms.jpg);\r\n\tbackground-repeat: no-repeat;\r\n\tmargin-left: auto;\r\n\tmargin-right: auto;\r\n\tdisplay: block;\r\n\tposition: relative;\r\n\t-webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);\r\n\tclip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);\r\n\tclip-path: url(\"#clip-diamond-demo\");\r\n}\r\n.overlay {\r\n\tbackground: rgba(0, 125, 116, 0.6);\r\n\tposition: absolute;\r\n\tleft: 0;\r\n\tright: 0;\r\n\ttop: 0;\r\n\tbottom: 0;\r\n\tpointer-events: none;\r\n\t-webkit-transition: all 0.3s linear;\r\n\t-moz-transition: all 0.3s linear;\r\n\t-o-transition: all 0.3s linear;\r\n\t-ms-transition: all 0.3s linear;\r\n\ttransition: all 0.3s linear;\r\n}\r\n.overlay-content {\r\n\tcolor: rgba(255, 255, 255, 0.7);\r\n\tfont-weight: 400;\r\n\tfont-size: 170%;\r\n\ttext-transform: uppercase;\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t-ms-transform: translateX(-50%) translateY(-50%);\r\n\t-webkit-transform: translateX(-50%) translateY(-50%);\r\n\t-moz-transform: translateX(-50%) translateY(-50%);\r\n\t-o-transform: translateX(-50%) translateY(-50%);\r\n\ttransform: translateX(-50%) translateY(-50%);\r\n\ttext-shadow: 1px 1px 2px rgba(0,0,0,0.1);\r\n}\r\n.loz-vms-wrap:hover .overlay {\r\n\t-webkit-transition: all 0.4s ease-in;\r\n\t-o-transition: all 0.4s ease-in;\r\n\t-moz-transition: all 0.4s ease-in;\r\n\t-ms-transition: all 0.4s ease-in;\r\n\ttransition: all 0.4s ease-in;\r\n\tbackground: none;\r\n}\r\n.loz-vms-img {\r\n\tdisplay: block;\r\n}\r\n\r\n@media only screen and (min-width: 650px) {\r\n.loz-vms-row {\r\n\tmargin-top: -154px;\r\n}\r\n.loz-vms-row:first-of-type {\r\n\tmargin-top: auto;\r\n}\r\n.loz-vms-wrap {\r\n\tdisplay: inline-block;\r\n}\r\n}\r\n<\/pre>\n\u0646\u06a9\u062a\u0647 1 :<\/span> \u062f\u0631 \u06a9\u062f \u0647\u0627\u06cc css \u0628\u0647 \u062c\u0627\u06cc bg_vms.jpg \u0645\u06cc\u062a\u0648\u0627\u0646\u06cc\u062f \u0622\u062f\u0631\u0633 \u0639\u06a9\u0633 \u0645\u0648\u0631\u062f \u0646\u0638\u0631 \u062e\u0648\u062f \u0631\u0627 \u0648\u0627\u0631\u062f \u0646\u0645\u0627\u06cc\u06cc\u062f .<\/p>\n\u0646\u06a9\u062a\u0647 2 :<\/span> \u0647\u0645\u0627\u0646 \u0637\u0648\u0631 \u06a9\u0647 \u06af\u0641\u062a\u0647 \u0634\u062f\u0647 \u0628\u0648\u062f \u0627\u06cc\u0646 4 \u0644\u0648\u0632\u06cc \u0647\u0645\u06af\u06cc \u0627\u0632 \u06cc\u06a9 \u0639\u06a9\u0633 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc\u06a9\u0646\u0646\u062f \u0648 \u0646\u0642\u0627\u0637 \u0645\u062e\u062a\u0644\u0641\u06cc \u0627\u0632 \u0622\u0646 \u0631\u0627 \u062f\u0631 \u062e\u0648\u062f \u0646\u0645\u0627\u06cc\u0634 \u0645\u06cc\u062f\u0647\u0646\u062f , \u067e\u0633 \u0628\u0631\u0627\u06cc \u062a\u0639\u0648\u0636\u06cc \u0645\u06a9\u0627\u0646 \u0642\u0631\u0627\u0631 \u06af\u06cc\u0631\u06cc \u0645\u06cc\u062a\u0648\u0627\u0646\u06cc\u062f \u062f\u0631 \u06a9\u062f \u0647\u0627\u06cc css \u0628\u0627\u0644\u0627 \u0627\u0632 \u062e\u0637 \u0634\u0645\u0627\u0631\u0647 11 \u062a\u0627 \u062e\u0637 22 \u0631\u0627 \u0628\u0627 \u062a\u0648\u062c\u0647 \u0628\u0647 \u0633\u0644\u06cc\u0642\u0647 \u062e\u0648\u062f \u062a\u063a\u06cc\u06cc\u0631 \u062f\u0647\u06cc\u062f . \u0645\u0646\u0638\u0648\u0631 top , left , right \u0648 bottom \u0627\u0633\u062a .<\/p>\n\u062f\u0645\u0648\u06cc \u0642\u0627\u0644\u0628 Intro<\/a><\/span><\/p>\n\u067e\u062e\u0634 \u0627\u062e\u062a\u0635\u0627\u0635\u06cc<\/p>\n
\u0622\u0645\u0648\u0632\u0634 \u0648\u062d\u06cc\u062f \u0645\u062c\u06cc\u062f\u06cc<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"\u062f\u0631 \u0627\u06cc\u0646 \u067e\u0633\u062a \u06cc\u06a9 \u0635\u0641\u062d\u0647 Intro \u0622\u0645\u0627\u062f\u0647 \u0631\u0627 \u0628\u0631\u0627\u06cc \u0634\u0645\u0627 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u06af\u0631\u0627\u0645\u06cc \u0622\u0645\u0627\u062f\u0647 \u0633\u0627\u062e\u062a\u0647 \u0627\u0645 \u06a9\u0647 \u0627\u0646\u0634\u0627\u0644\u0644\u0647 \u0645\u0648\u0631\u062f \u067e\u0633\u0646\u062f \u0634\u0645\u0627 \u062f\u0648\u0633\u062a\u0627\u0646 \u0642\u0631\u0627\u0631 \u06af\u06cc\u0631\u062f . \u0627\u06cc\u0646 \u0635\u0641\u062d\u0647 \u0628\u0647 \u0635\u0648\u0631\u062a \u062a\u06a9 \u067e\u06cc\u0686 \u0628\u0648\u062f\u0647 \u0648 \u0628\u0647 \u0635\u0648\u0631\u062a html5 \u0648 css3 \u0645\u06cc \u0628\u0627\u0634\u062f \u06a9\u0647 \u062f\u0627\u0631\u0627\u06cc \u0627\u0641\u06a9\u062a \u0632\u06cc\u0628\u0627\u06cc\u06cc \u0647\u0633\u062a . \u062f\u0631 \u0627\u06cc\u0646 \u0635\u0641\u062d\u0647 , \u0641\u0642\u0637 \u06cc\u06a9 \u0639\u06a9\u0633 \u0628\u0647 \u06a9\u0627\u0631 \u0631\u0641\u062a\u0647 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[565,1629,15],"tags":[18120,18119,18116,21,18114,18117,18118,18115,18121,363],"_links":{"self":[{"href":"https:\/\/www.xn--mgbguh09aqiwi.com\/wp-json\/wp\/v2\/posts\/16869"}],"collection":[{"href":"https:\/\/www.xn--mgbguh09aqiwi.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.xn--mgbguh09aqiwi.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.xn--mgbguh09aqiwi.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.xn--mgbguh09aqiwi.com\/wp-json\/wp\/v2\/comments?post=16869"}],"version-history":[{"count":0,"href":"https:\/\/www.xn--mgbguh09aqiwi.com\/wp-json\/wp\/v2\/posts\/16869\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.xn--mgbguh09aqiwi.com\/wp-json\/wp\/v2\/media?parent=16869"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.xn--mgbguh09aqiwi.com\/wp-json\/wp\/v2\/categories?post=16869"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.xn--mgbguh09aqiwi.com\/wp-json\/wp\/v2\/tags?post=16869"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}