{"id":990,"date":"2016-04-22T15:11:22","date_gmt":"2016-04-22T12:11:22","guid":{"rendered":"http:\/\/starhack.ru\/?p=990"},"modified":"2016-04-22T15:12:51","modified_gmt":"2016-04-22T12:12:51","slug":"ispolzuete-li-vy-flexbox","status":"publish","type":"post","link":"http:\/\/starhack.ru\/ispolzuete-li-vy-flexbox\/","title":{"rendered":"??\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u043b\u0438 \u0432\u044b Flexbox?"},"content":{"rendered":"

\u0427\u0443\u0434\u0435\u0441\u043d\u0430\u044f \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f \u0434\u043b\u044f \u0432\u0435\u0440\u0441\u0442\u043a\u0438 \u044d\u0442\u043e\u0442 flexbox. \u0427\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u0438\u043c \u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0441\u044c, \u0442\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0440\u0430\u0432\u0438\u0442\u0441\u044f.
\n\u041d\u0430 \u0442\u0435\u043a\u0443\u0449\u0435\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e \u043f\u043e\u0434\u0445\u043e\u0434, \u043f\u043e\u0437\u0430\u0438\u043c\u0441\u0442\u0432\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0443 Angular Material<\/a>. Angular Material \u0432\u043c\u0435\u0441\u0442\u043e CSS-\u043a\u043b\u0430\u0441\u0441\u043e\u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b. \u0412\u043e\u0442 \u0438 \u0432\u0430\u0448 \u043f\u043e\u043a\u043e\u0440\u043d\u044b\u0439 \u0441\u043b\u0443\u0433\u0430 \u0440\u0435\u0448\u0438\u043b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u043f\u043e\u0434\u0445\u043e\u0434. \u0414\u043b\u044f \u0437\u0430\u0434\u0430\u043d\u0438\u044f \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 display: flex; flex-direction: row; <\/code> \u0430\u0442\u0440\u0438\u0431\u0443\u0442 mo-layout<\/code> \u0431\u0435\u0437 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0430 \u0434\u043b\u044f display: flex; flex-direction: column; <\/code> \u0442\u043e\u0442 \u0436\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442 \u043d\u043e \u0441\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c column<\/code>. \u041f\u0440\u0438\u043c\u0435\u0440\u043d\u043e \u0442\u0430\u043a:<\/p>\n

\r\n[mo-layout] {\r\n    display: flex;\r\n    flex-direction: row;\r\n}\r\n[mo-layout=\"column\"] {\r\n    display: flex;\r\n    flex-direction: column;\r\n}<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"

\u0427\u0443\u0434\u0435\u0441\u043d\u0430\u044f \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f \u0434\u043b\u044f \u0432\u0435\u0440\u0441\u0442\u043a\u0438 \u044d\u0442\u043e\u0442 flexbox. \u0427\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u0438\u043c \u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0441\u044c, \u0442\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0440\u0430\u0432\u0438\u0442\u0441\u044f. \u041d\u0430 \u0442\u0435\u043a\u0443\u0449\u0435\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e \u043f\u043e\u0434\u0445\u043e\u0434, \u043f\u043e\u0437\u0430\u0438\u043c\u0441\u0442\u0432\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0443 Angular Material. Angular Material \u0432\u043c\u0435\u0441\u0442\u043e CSS-\u043a\u043b\u0430\u0441\u0441\u043e\u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b. \u0412\u043e\u0442 \u0438 \u0432\u0430\u0448 \u043f\u043e\u043a\u043e\u0440\u043d\u044b\u0439 \u0441\u043b\u0443\u0433\u0430 \u0440\u0435\u0448\u0438\u043b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u043f\u043e\u0434\u0445\u043e\u0434. \u0414\u043b\u044f \u0437\u0430\u0434\u0430\u043d\u0438\u044f \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 display: flex; flex-direction: row; \u0430\u0442\u0440\u0438\u0431\u0443\u0442 mo-layout \u0431\u0435\u0437 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0430 \u0434\u043b\u044f display: flex; flex-direction: column; \u0442\u043e\u0442 … \u0427\u0438\u0442\u0430\u0442\u044c \u0434\u0430\u043b\u0435\u0435 ??\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u043b\u0438 \u0432\u044b Flexbox?<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[8,13],"tags":[47,83],"_links":{"self":[{"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/posts\/990"}],"collection":[{"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/comments?post=990"}],"version-history":[{"count":2,"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/posts\/990\/revisions"}],"predecessor-version":[{"id":992,"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/posts\/990\/revisions\/992"}],"wp:attachment":[{"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/media?parent=990"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/categories?post=990"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/starhack.ru\/wp-json\/wp\/v2\/tags?post=990"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}