\n
![](\"https:\/\/planeta21vek.ru\/elina732\/wp-content\/uploads\/2025\/05\/apelsin010525.jpg\")
<\/p>\n\u0422\u0435\u0433 img \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0432\u0441\u0442\u0430\u0432\u043a\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u043d\u0430 \u0432\u0435\u0431-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b. \u0422\u0435\u0433 picture \u0441\u043b\u0443\u0436\u0438\u0442 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u043e\u043c \u0434\u043b\u044f \u043e\u0434\u043d\u043e\u0433\u043e \u0438\u043b\u0438 \u0431\u043e\u043b\u0435\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 source \u0438 \u043e\u0434\u043d\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 img \u0434\u043b\u044f \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0435\u043d\u0438\u044f \u043e\u043f\u0442\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432 \u044d\u043a\u0440\u0430\u043d\u0430. \u0422\u0435\u0433 figure \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e \u0432\u044b\u0432\u043e\u0434\u0430 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0441 \u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u043f\u043e\u0434\u043f\u0438\u0441\u044c\u044e, \u0438\u043d\u043e\u0433\u0434\u0430 \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u043c\u043e\u0439 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u043c.<\/p>\n
\n<\/p>\n
\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u041a\u0440\u0443\u0433\u043b\u044b\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/title>\r\n <style>\r\n .round {\r\n border-radius: 100px; \/* \u0420\u0430\u0434\u0438\u0443\u0441 \u043e\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u0438\u044f *\/\r\n box-shadow: 0 0 0 3px green, 0 0 13px #333; \/* \u041f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0442\u0435\u043d\u0435\u0439 *\/\r\n margin: 3px;\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p><img src="images\/thumb1.jpg" alt="" class="round">\r\n <img src="images\/thumb2.jpg" alt="" class="round">\r\n <img src="images\/thumb3.jpg" alt="" class="round"><\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0411\u043b\u043e\u043a \u0441\u043e \u043e\u043a\u0440\u0443\u0433\u043b\u0451\u043d\u043d\u044b\u043c\u0438 \u0443\u0433\u043e\u043b\u043a\u0430\u043c\u0438 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e CSS3<\/span><\/h2>\ndiv { border-radius: 10px; }\t\u0420\u0430\u0434\u0438\u0443\u0441 \u0441\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u0443\u0433\u043e\u043b\u043a\u043e\u0432 \u0441\u0440\u0430\u0437\u0443.
\t
\ndiv { border-radius: 0 10px; }\t\u041f\u0435\u0440\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0440\u0430\u0434\u0438\u0443\u0441 \u043b\u0435\u0432\u043e\u0433\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u0438 \u043f\u0440\u0430\u0432\u043e\u0433\u043e \u043d\u0438\u0436\u043d\u0435\u0433\u043e \u0443\u0433\u043e\u043b\u043a\u0430, \u0432\u0442\u043e\u0440\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u2014 \u0434\u043b\u044f \u043f\u0440\u0430\u0432\u043e\u0433\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u0438 \u043b\u0435\u0432\u043e\u0433\u043e \u043d\u0438\u0436\u043d\u0435\u0433\u043e.
\t
\ndiv { border-radius: 20px 10px 0; }\t\u041f\u0435\u0440\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0437\u0430\u0434\u0430\u0451\u0442 \u0440\u0430\u0434\u0438\u0443\u0441 \u043b\u0435\u0432\u043e\u0433\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u0443\u0433\u043e\u043b\u043a\u0430, \u0432\u0442\u043e\u0440\u043e\u0435 \u2014 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u043f\u0440\u0430\u0432\u043e\u0433\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u0438 \u043b\u0435\u0432\u043e\u0433\u043e \u043d\u0438\u0436\u043d\u0435\u0433\u043e, \u0430 \u0442\u0440\u0435\u0442\u044c\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u2014 \u043f\u0440\u0430\u0432\u043e\u0433\u043e \u043d\u0438\u0436\u043d\u0435\u0433\u043e.
\t
\ndiv { border-radius: 20px 10px 5px 0; }\t\u041f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0440\u0430\u0434\u0438\u0443\u0441 \u043b\u0435\u0432\u043e\u0433\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u0443\u0433\u043e\u043b\u043a\u0430, \u043f\u0440\u0430\u0432\u043e\u0433\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e, \u043f\u0440\u0430\u0432\u043e\u0433\u043e \u043d\u0438\u0436\u043d\u0435\u0433\u043e \u0438 \u043b\u0435\u0432\u043e\u0433\u043e \u043d\u0438\u0436\u043d\u0435\u0433\u043e.<\/p>\n
\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0420\u0430\u0434\u0438\u0443\u0441<\/title>\r\n <style>\r\n div {\r\n background: #007E3E; \/* \u0426\u0432\u0435\u0442 \u0444\u043e\u043d\u0430 *\/\r\n color: #fff; \/* \u0426\u0432\u0435\u0442 \u0442\u0435\u043a\u0441\u0442\u0430 *\/\r\n padding: 10px; \/* \u041f\u043e\u043b\u044f \u0432\u043e\u043a\u0440\u0443\u0433 \u0442\u0435\u043a\u0441\u0442\u0430 *\/\r\n -moz-border-radius: 5px; \/* \u0414\u043b\u044f Firefox 3 *\/\r\n -webkit-border-radius: 5px; \/* \u0414\u043b\u044f Safari 4 \u0438 Chrome *\/\r\n border-radius: 5px; \/* \u0414\u043b\u044f \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <div>\u041c\u0435\u043d\u044f \u2014 \u0441\u0443\u043f\u043f\u043b\u0435\u0442\u0438\u0432\u043d\u0430\u044f \u0444\u043e\u0440\u043c\u0430 \u0432\u0438\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0430\u0434\u0435\u0436\u0430 \u043e\u0442 \u044f.<\/div>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0411\u043b\u043e\u043a \u0441 \u0437\u0430\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u0438\u044f\u043c\u0438<\/span><\/h2>\n\r\n<!DOCTYPE html PUBLIC "-\/\/W3C\/\/DTD XHTML 1.0 Strict\/\/EN" \r\n "http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-strict.dtd">\r\n<html xmlns="http:\/\/www.w3.org\/1999\/xhtml">\r\n <head>\r\n <meta http-equiv="Content-Type" content="text\/html; charset=utf-8" \/>\r\n <title>\u0410\u0434\u0440\u0435\u0441<\/title>\r\n <style type="text\/css">\r\n p.address, p.address span {\r\n background: url(images\/roundbg.png) no-repeat; \/* \u041f\u0443\u0442\u044c \u043a \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044e *\/\r\n height: 36px; \/* \u0412\u044b\u0441\u043e\u0442\u0430 \u0431\u043b\u043e\u043a\u0430 *\/\r\n width: 150px; \/* \u0428\u0438\u0440\u0438\u043d\u0430 \u0431\u043b\u043e\u043a\u0430 *\/\r\n text-align: center; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u043e \u0446\u0435\u043d\u0442\u0440\u0443 *\/\r\n } \r\n p.address span {\r\n display: block; \/* \u0411\u043b\u043e\u0447\u043d\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 *\/\r\n background-position: 100% 0; \/* \u041f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u0430 *\/\r\n position: relative; \/* \u041e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 *\/\r\n left: 17px; \/* \u0421\u0434\u0432\u0438\u0433\u0430\u0435\u043c \u0432\u043f\u0440\u0430\u0432\u043e *\/\r\n padding: 6px 0; \/* \u041f\u043e\u043b\u044f \u0432\u043e\u043a\u0440\u0443\u0433 \u0442\u0435\u043a\u0441\u0442\u0430 *\/\r\n text-indent: -17px; \/* \u0421\u0434\u0432\u0438\u0433\u0430\u0435\u043c \u0442\u0435\u043a\u0441\u0442 \u0432\u043b\u0435\u0432\u043e *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body> \r\n <p class="address"><span>\u0443\u043b. \u041c\u043e\u0433\u0438\u043b\u044c\u0449\u0438\u043a\u043e\u0432, 66<\/span><\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0421\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u043d\u044b\u0435 \u0443\u0433\u043e\u043b\u043a\u0438 \u0443 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0421\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u043d\u044b\u0435 \u0443\u0433\u043e\u043b\u043a\u0438<\/title>\r\n <style>\r\n .roundcorner {\r\n position: relative; \/* \u041e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 *\/\r\n float: left; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u043e \u043b\u0435\u0432\u043e\u043c\u0443 \u043a\u0440\u0430\u044e \u0441 \u043e\u0431\u0442\u0435\u043a\u0430\u043d\u0438\u0435\u043c *\/\r\n margin-right: 20px; \/* \u041e\u0442\u0441\u0442\u0443\u043f \u0441\u043f\u0440\u0430\u0432\u0430 *\/\r\n }\r\n .roundcorner div {\r\n position: absolute; \/* \u0410\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e\u0435 \u043f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 *\/\r\n top: 0; left: 0; \/* \u041d\u0443\u043b\u0435\u0432\u044b\u0435 \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u044b *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <div class="roundcorner">\r\n <img src="images\/thumb1.jpg" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f 1" width="120" height="120">\r\n <div><img src="images\/round.png" alt="" width="120" height="120"><\/div>\r\n <\/div>\r\n <div class="roundcorner">\r\n <img src="images\/thumb2.jpg" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f 2" width="120" height="120">\r\n <div><img src="images\/round.png" alt="" width="120" height="120"><\/div>\r\n <\/div>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u041d\u0430\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u043e\u0432\u043e\u0433\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0438 \u0438\u043c\u0438\u0442\u0430\u0446\u0438\u044f \u043e\u0432\u0430\u043b\u044c\u043d\u044b\u0445 \u0443\u0433\u043b\u043e\u0432<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0421\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u043d\u044b\u0435 \u0443\u0433\u043e\u043b\u043a\u0438<\/title>\r\n <style>\r\n .roundcorner {\r\n position: relative; \/* \u041e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 *\/\r\n float: left; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u043e \u043b\u0435\u0432\u043e\u043c\u0443 \u043a\u0440\u0430\u044e \u0441 \u043e\u0431\u0442\u0435\u043a\u0430\u043d\u0438\u0435\u043c *\/\r\n margin-right: 20px; \/* \u041e\u0442\u0441\u0442\u0443\u043f \u0441\u043f\u0440\u0430\u0432\u0430 *\/\r\n }\r\n .roundcorner div {\r\n background: url(images\/round.png); \/* \u0420\u0438\u0441\u0443\u043d\u043e\u043a \u0441 \u0443\u0433\u043e\u043b\u043a\u0430\u043c\u0438 *\/\r\n position: absolute; \/* \u0410\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e\u0435 \u043f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 *\/\r\n left: 0; top: 0; \/* \u041f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043e\u0442 \u043b\u0435\u0432\u043e\u0433\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u0443\u0433\u043b\u0430 *\/\r\n width: 100%; height: 100%; \/* \u0420\u0430\u0437\u043c\u0435\u0440\u044b \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u044e\u0442 \u0441 \u0444\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u0435\u0439 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <div class="roundcorner">\r\n <img src="images\/thumb1.jpg" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f 1" width="120" height="120">\r\n <div><\/div>\r\n <\/div>\r\n <div class="roundcorner">\r\n <img src="images\/thumb2.jpg" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f 2" width="120" height="120">\r\n <div><\/div>\r\n <\/div>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u0440\u0430\u043c\u043a\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0426\u0432\u0435\u0442 \u0440\u0430\u043c\u043a\u0438<\/title>\r\n <style>\r\n a img {\r\n border: 3px solid #53da3f; \/* \u0420\u0430\u043c\u043a\u0430 \u0432\u043e\u043a\u0440\u0443\u0433 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f-\u0441\u0441\u044b\u043b\u043a\u0438 *\/\r\n } \r\n a:hover img {\r\n border: 3px solid #f26522; \/* \u0420\u0430\u043c\u043a\u0430 \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u043d\u0430 \u0441\u0441\u044b\u043b\u043a\u0443 \u043a\u0443\u0440\u0441\u043e\u0440\u0430 \u043c\u044b\u0448\u0438 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p>\r\n <a href="vinnie-the-pooh.html">\r\n <img src="images\/figure.jpg" alt="\u0412\u0438\u043d\u043d\u0438-\u041f\u0443\u0445" width="100" height="111"><\/a>\r\n <a href="vinnie-the-pooh.html">\r\n <img src="images\/figure.jpg" alt="\u0412\u0438\u043d\u043d\u0438-\u041f\u0443\u0445" width="100" height="111"><\/a>\r\n <\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0438\u043b\u0438<\/p>\n
\r\nimg {\r\n border: 3px solid #53da3f; \/* \u0420\u0430\u043c\u043a\u0430 \u0432\u043e\u043a\u0440\u0443\u0433 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f *\/\r\n} \r\nimg:hover {\r\n border: 3px solid #f26522; \/* \u0420\u0430\u043c\u043a\u0430 \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u043d\u0430 \u0440\u0438\u0441\u0443\u043d\u043e\u043a \u043a\u0443\u0440\u0441\u043e\u0440\u0430 \u043c\u044b\u0448\u0438 *\/\r\n}\r\n<\/pre>\n\u0411\u043e\u043b\u044c\u0448\u0430\u044f, \u0443\u0441\u0438\u043b\u0435\u043d\u043d\u0430\u044f \u0440\u0430\u043c\u043a\u0430 \u0432\u043e\u043a\u0440\u0443\u0433 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u041f\u0430\u0441\u043f\u0430\u0440\u0442\u0443<\/title>\r\n <style>\r\n .passe-partout {\r\n padding: 30px; \/* \u0428\u0438\u0440\u0438\u043d\u0430 \u043f\u0430\u0441\u043f\u0430\u0440\u0442\u0443 *\/\r\n background: #f0f0f0; \/* \u0426\u0432\u0435\u0442 \u0444\u043e\u043d\u0430 \u043f\u0430\u0441\u043f\u0430\u0440\u0442\u0443 *\/\r\n border: 2px solid #666; \/* \u041f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0440\u0430\u043c\u043a\u0438 *\/ \r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p><img src="images\/mufta.jpg" alt="\u0414\u0435\u0432\u043e\u0447\u043a\u0430 \u0441 \u043c\u0443\u0444\u0442\u043e\u0439" class="passe-partout"><\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0438\u043b\u0438, \u0432\u043e\u043a\u0440\u0443\u0433 figure \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b Chrome \u0438 Firefox \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e\u0442 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043e\u0442\u0441\u0442\u0443\u043f\u044b \u043f\u043e 40 \u043f\u0438\u043a\u0441\u0435\u043b\u043e\u0432<\/p>\n
\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u041f\u0430\u0441\u043f\u0430\u0440\u0442\u0443<\/title>\r\n <style>\r\n .passe-partout {\r\n padding: 40px; \/* \u0420\u0430\u0437\u043c\u0435\u0440 \u043f\u0430\u0441\u043f\u0430\u0440\u0442\u0443 *\/\r\n background: #f0f0f0; \/* \u0426\u0432\u0435\u0442 \u0444\u043e\u043d\u0430 \u043f\u0430\u0441\u043f\u0430\u0440\u0442\u0443 *\/\r\n border: 2px solid #800000; \/* \u041f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0440\u0430\u043c\u043a\u0438 *\/\r\n display: inline-block; \/* \u0421\u0442\u0440\u043e\u0447\u043d\u043e-\u0431\u043b\u043e\u0447\u043d\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 *\/\r\n margin: 0; \/* \u0423\u0431\u0438\u0440\u0430\u0435\u043c \u043e\u0442\u0441\u0442\u0443\u043f\u044b *\/\r\n } \r\n .passe-partout img {\r\n border: 2px solid #666; \/* \u0420\u0430\u043c\u043a\u0430 \u0432\u043e\u043a\u0440\u0443\u0433 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f *\/\r\n }\r\n <\/style>\r\n <!--[if lt IE 9]>\r\n <script>document.createElement('figure');<\/script>\r\n <![endif]-->\r\n <\/head>\r\n <body>\r\n <figure class="passe-partout">\r\n <img src="images\/siberia.jpg" width="200" height="231" alt="\u041f\u043e\u043b\u044f\u0440\u043d\u0438\u043a">\r\n <\/figure>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0423\u0431\u0440\u0430\u0442\u044c \u0440\u0430\u043c\u043a\u0443 \u0432\u043e\u043a\u0440\u0443\u0433 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439-\u0441\u0441\u044b\u043b\u043e\u043a<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0420\u0438\u0441\u0443\u043d\u043e\u043a \u0431\u0435\u0437 \u0440\u0430\u043c\u043a\u0438<\/title>\r\n <style>\r\n a img {\r\n border: none; \/* \u0423\u0431\u0438\u0440\u0430\u0435\u043c \u0440\u0430\u043c\u043a\u0443 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p><a href="link.html">\r\n <img src="images\/sample.gif" width="100" height="100" alt="\u0420\u0438\u0441\u0443\u043d\u043e\u043a \u0431\u0435\u0437 \u0440\u0430\u043c\u043a\u0438">\r\n <\/a><\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0432\u0438\u0434\u0430 \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0435\u0439 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0412\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0430\u044f \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430<\/title>\r\n <style>\r\n #floatTip {\r\n position: absolute; width: 250px; display: none; \r\n border: 1px solid #000; padding: 4px;\r\n font-family: sans-serif; font-size: 9pt;\r\n color: #333; background: #ffe5ff;\r\n }\r\n <\/style>\r\n <script src="scripts\/tooltip.js"><\/script>\r\n <\/head>\r\n <body>\r\n <p><img src="images\/odel.jpg" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f" \r\n onMouseOver="toolTip('\u0424\u043e\u0442\u043e\u0430\u043f\u043f\u0430\u0440\u0430\u0442: Canon EOS 350D<br>\u041e\u0431\u044a\u0435\u043a\u0442\u0438\u0432: Canon EF 24-105 f\/4L IS USM<br>\u0412\u0441\u043f\u044b\u0448\u043a\u0430: Canon Speedlite 580 EX<br>\u0412\u044b\u0434\u0435\u0440\u0436\u043a\u0430: 1\/125<br>\u0414\u0438\u0430\u0444\u0440\u0430\u0433\u043c\u0430: 5.6')" \r\n onMouseOut="toolTip()"><\/p>\r\n <div id="floatTip"><\/div>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0421\u043a\u0440\u0438\u043f\u0442<\/p>\n
\r\ndocument.onmousemove = moveTip;\r\nfunction moveTip(e) {\r\n floatTipStyle = document.getElementById("floatTip").style;\r\n w = 250; \/\/ \u0428\u0438\u0440\u0438\u043d\u0430 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438\r\n\r\n \/\/ \u0414\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 IE6-8\r\n if (document.all) { \r\n x = event.clientX + document.body.scrollLeft; \r\n y = event.clientY + document.body.scrollTop; \r\n\r\n \/\/ \u0414\u043b\u044f \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432\r\n } else { \r\n x = e.pageX; \/\/ \u041a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u0430 X \u043a\u0443\u0440\u0441\u043e\u0440\u0430\r\n y = e.pageY; \/\/ \u041a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u0430 Y \u043a\u0443\u0440\u0441\u043e\u0440\u0430\r\n }\r\n\r\n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0439 \u0441\u043f\u0440\u0430\u0432\u0430 \u043e\u0442 \u043a\u0443\u0440\u0441\u043e\u0440\u0430 \r\n if ((x + w + 10) < document.body.clientWidth) { \r\n floatTipStyle.left = x + 'px';\r\n\r\n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0439 \u0441\u043b\u0435\u0432\u0430 \u043e\u0442 \u043a\u0443\u0440\u0441\u043e\u0440\u0430\r\n } else { \r\n floatTipStyle.left = x - w + 'px';\r\n }\r\n\r\n \/\/ \u041f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043e\u0442 \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u043a\u0440\u0430\u044f \u043e\u043a\u043d\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430\r\n floatTipStyle.top = y + 20 + 'px';\r\n}\r\n\r\nfunction toolTip(msg) {\r\n floatTipStyle = document.getElementById("floatTip").style;\r\n if (msg) {\r\n \/\/ \u0412\u044b\u0432\u043e\u0434\u0438\u043c \u0442\u0435\u043a\u0441\u0442 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438\r\n document.getElementById("floatTip").innerHTML = msg;\r\n \/\/ \u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0443\r\n floatTipStyle.display = "block";\r\n } else { \r\n \/\/ \u041f\u0440\u044f\u0447\u0435\u043c \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0443\r\n floatTipStyle.display = "none";\r\n } \r\n}\r\n<\/pre>\n\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u0432\u0441\u044e \u0448\u0438\u0440\u0438\u043d\u0443 \u043e\u043a\u043d\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8" \/>\r\n <title>\u0428\u0438\u0440\u0438\u043d\u0430 100%<\/title>\r\n <\/head>\r\n <body>\r\n <p><img src="images\/figure.jpg" alt="\u0412\u0438\u043d\u043d\u0438-\u041f\u0443\u0445" width="100%"><\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u0446\u0435\u043d\u0442\u0440\u0443 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u0444\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u0438 \u043f\u043e \u0446\u0435\u043d\u0442\u0440\u0443<\/title>\r\n <style>\r\n .fig {\r\n text-align: center; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u043e \u0446\u0435\u043d\u0442\u0440\u0443 *\/ \r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p>\u0422\u0435\u043a\u0441\u0442 \u0434\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/p>\r\n <p class="fig"><img src="images\/photo1.jpg" \r\n width="320" height="181" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f"><\/p>\r\n <p>\u0422\u0435\u043a\u0441\u0442 \u043f\u043e\u0441\u043b\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u0446\u0435\u043d\u0442\u0440\u0443 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0441 \u043f\u043e\u0434\u043f\u0438\u0441\u044c\u044e, \u0434\u043b\u044f \u0431\u043b\u043e\u043a\u0430 \u0441 \u0444\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u0435\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0442\u0435\u0433 figure, \u0430 \u0434\u043b\u044f \u043f\u043e\u0434\u043f\u0438\u0441\u0438 \u043a \u043d\u0435\u043c\u0443 \u0442\u0435\u0433 figcaption<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f \u0441 \u043f\u043e\u0434\u043f\u0438\u0441\u044c\u044e<\/title>\r\n <style>\r\n .fig {\r\n display: block; \/* \u0411\u043b\u043e\u0447\u043d\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 (\u0434\u043b\u044f \u0441\u0442\u0430\u0440\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432) *\/\r\n text-align: center; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u043e \u0446\u0435\u043d\u0442\u0440\u0443 *\/\r\n font-style: italic; \/* \u041a\u0443\u0440\u0441\u0438\u0432\u043d\u043e\u0435 \u043d\u0430\u0447\u0435\u0440\u0442\u0430\u043d\u0438\u0435 *\/\r\n margin-top: 0; \/* \u041e\u0442\u0441\u0442\u0443\u043f \u0441\u0432\u0435\u0440\u0445\u0443 *\/\r\n margin-bottom: 5px; \/* \u041e\u0442\u0441\u0442\u0443\u043f \u0441\u043d\u0438\u0437\u0443 *\/\r\n color: #666; \/* \u0426\u0432\u0435\u0442 \u043f\u043e\u0434\u0440\u0438\u0441\u0443\u043d\u043e\u0447\u043d\u043e\u0439 \u043f\u043e\u0434\u043f\u0438\u0441\u0438 *\/\r\n }\r\n <\/style>\r\n <!--[if lt IE 9]>\r\n <script>\r\n document.createElement('figure');\r\n document.createElement('figcaption');\r\n <\/script>\r\n <![endif]-->\r\n <\/head>\r\n <body>\r\n <figure class="fig">\r\n <img src="images\/photo2.jpg" width="320" height="179" \r\n alt="\u0411\u0430\u0440\u0435\u043b\u044c\u0435\u0444">\r\n <figcaption>\r\n \u041f\u0435\u0449\u0435\u0440\u043d\u044b\u0439 \u0447\u0435\u043b\u043e\u0432\u0435\u043a \u0434\u043e\u0431\u044b\u0432\u0430\u0435\u0442 \u043e\u0433\u043e\u043d\u044c. \r\n \u041d\u043e \u0447\u0442\u043e \u044d\u0442\u043e \u0437\u0430 \u043b\u0443\u043d\u043d\u0430\u044f \u043f\u043e\u0432\u0435\u0440\u0445\u043d\u043e\u0441\u0442\u044c \u043d\u0430 \u0437\u0430\u0434\u043d\u0435\u043c \u043f\u043b\u0430\u043d\u0435? \u041d\u0435\u0442, \u043d\u0435 \u0442\u0430\u043a \u0432\u0441\u0435 \u043f\u0440\u043e\u0441\u0442\u043e.\r\n <\/figcaption>\r\n <\/figure>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u041e\u0431\u0442\u0435\u043a\u0430\u043d\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0442\u0435\u043a\u0441\u0442\u043e\u043c<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u041e\u0431\u0442\u0435\u043a\u0430\u043d\u0438\u0435<\/title>\r\n <style>\r\n .leftimg {\r\n float:left; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u043e \u043b\u0435\u0432\u043e\u043c\u0443 \u043a\u0440\u0430\u044e *\/\r\n margin: 7px 7px 7px 0; \/* \u041e\u0442\u0441\u0442\u0443\u043f\u044b \u0432\u043e\u043a\u0440\u0443\u0433 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0438 *\/\r\n }\r\n .rightimg {\r\n float: right; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u043e \u043f\u0440\u0430\u0432\u043e\u043c\u0443 \u043a\u0440\u0430\u044e *\/ \r\n margin: 7px 0 7px 7px; \/* \u041e\u0442\u0441\u0442\u0443\u043f\u044b \u0432\u043e\u043a\u0440\u0443\u0433 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0438 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <h2>\u0414\u043e\u043a\u043b\u0430\u0434 \u043b\u0435\u0439\u0442\u0435\u043d\u0430\u043d\u0442\u0430 \u0411\u043e\u043a\u0430\u0442\u0443\u0435\u0432\u0430<\/h2>\r\n <p><img src="images\/1.jpg" alt="\u041b\u0435\u0439\u0442\u0435\u043d\u0430\u043d\u0442 \u0411\u043e\u043a\u0430\u0442\u0443\u0435\u0432" width="132" height="174" class="leftimg">\r\n \u0412\u0447\u0435\u0440\u0430 \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u043f\u0440\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u0432\u0435\u0434\u043e\u043f\u0435\u0440\u0430\u0446\u0438\u0438 \u043d\u0430\u0448\u0430 \u0433\u0440\u0443\u043f\u043f\u0430 \u043f\u043e\u0434\u0432\u0435\u0440\u0433\u043b\u0430\u0441\u044c \u043d\u0430\u043f\u0430\u0434\u0435\u043d\u0438\u044e \u043d\u0435\u0438\u0437\u0432\u0435\u0441\u0442\u043d\u043e\u0433\u043e \r\n \u043f\u0440\u043e\u0442\u0438\u0432\u043d\u0438\u043a\u0430 \u0432 \u043a\u0430\u043c\u0443\u0444\u043b\u044f\u0436\u043d\u043e\u0439 \u0444\u043e\u0440\u043c\u0435 \u0410\u043b\u0438\u0435\u043d\u043e\u0432.<\/p>\r\n <h2>\u041f\u0440\u0435\u0441\u0441-\u0440\u0435\u043b\u0438\u0437 \u0430\u043d\u0430\u043b\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0433\u0440\u0443\u043f\u043f\u044b<\/h2>\r\n <p><img src="images\/2.jpg" alt="\u0423\u0447\u0451\u043d\u044b\u0435, \u043d\u0430\u0445\u043e\u0434\u044f\u0449\u0438\u0435\u0441\u044f \u0432 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0438 \u0430\u0444\u0444\u0435\u043a\u0442\u0430" class="rightimg">\r\n \u0412 \u043d\u0430\u0448\u0438\u0445 \u0441\u0435\u043a\u0440\u0435\u0442\u043d\u044b\u0445 \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f\u0445 \u0432 \u0440\u0430\u043c\u043a\u0430\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 «\u041f\u0430\u043d\u0434\u043e\u0440\u0430» \u0440\u0430\u0437\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u043b\u043e\u0441\u044c\r\n \u043f\u0441\u0438\u0445\u043e\u0442\u0440\u043e\u043f\u043d\u043e\u0435 \u043e\u0440\u0443\u0436\u0438\u0435.<\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u041f\u043e\u0434\u043f\u0438\u0441\u044c \u043f\u043e\u0434 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435\u043c \u0441 \u0440\u0430\u043c\u043a\u043e\u0439, \u0441 \u043e\u0431\u0442\u0435\u043a\u0430\u043d\u0438\u0435\u043c \u0442\u0435\u043a\u0441\u0442\u0430<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u041f\u043e\u0434\u0440\u0438\u0441\u0443\u043d\u043e\u0447\u043d\u0430\u044f \u043f\u043e\u0434\u043f\u0438\u0441\u044c<\/title>\r\n <style>\r\n .sign {\r\n float: right; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u043e \u043f\u0440\u0430\u0432\u043e\u043c\u0443 \u043a\u0440\u0430\u044e *\/\r\n border: 1px solid #333; \/* \u041f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0440\u0430\u043c\u043a\u0438 *\/\r\n padding: 7px; \/* \u041f\u043e\u043b\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0431\u043b\u043e\u043a\u0430 *\/\r\n margin: 10px 0 5px 5px; \/* \u041e\u0442\u0441\u0442\u0443\u043f\u044b \u0432\u043e\u043a\u0440\u0443\u0433 *\/\r\n background: #f0f0f0; \/* \u0426\u0432\u0435\u0442 \u0444\u043e\u043d\u0430 *\/ \r\n }\r\n .sign figcaption {\r\n margin: 0 auto 5px; \/* \u041e\u0442\u0441\u0442\u0443\u043f\u044b \u0432\u043e\u043a\u0440\u0443\u0433 \u0430\u0431\u0437\u0430\u0446\u0430 *\/\r\n }\r\n <\/style>\r\n <!--[if lt IE 9]>\r\n <script>\r\n document.createElement('figure');\r\n document.createElement('figcaption');<\/script>\r\n <![endif]-->\r\n <\/head>\r\n <body>\r\n <figure class="sign">\r\n <p><img src="images\/helen.jpg" width="150" height="212" alt="\u0421\u043a\u0443\u043b\u044c\u043f\u0442\u0443\u0440\u0430"><\/p>\r\n <figcaption>\u0414\u0435\u0440\u0435\u0432\u044f\u043d\u043d\u0430\u044f \u0441\u043a\u0443\u043b\u044c\u043f\u0442\u0443\u0440\u0430<\/figcaption>\r\n <\/figure>\r\n <p>\u0422\u043e\u0447\u043d\u043e\u0441\u0442\u044c \u043a\u0440\u0435\u043d\u0430 \u044d\u043b\u043b\u0438\u043f\u0442\u0438\u0447\u043d\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0440\u0435\u043d\u0435\u0431\u0440\u0435\u0447\u044c \u043a\u043e\u043b\u0435\u0431\u0430\u043d\u0438\u044f\u043c\u0438 \u043a\u043e\u0440\u043f\u0443\u0441\u0430, \u0445\u043e\u0442\u044f \u044d\u0442\u043e\u0433\u043e \r\n \u0432 \u043b\u044e\u0431\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u043d\u0435\u0441\u0442\u0430\u0446\u0438\u043e\u043d\u0430\u0440\u043d\u044b\u0439 \u0443\u0441\u043f\u043e\u043a\u043e\u0438\u0442\u0435\u043b\u044c \u043a\u0430\u0447\u043a\u0438, \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u043e\u0431\u0449\u0438\u0445 \u0442\u0435\u043e\u0440\u0435\u043c \r\n \u043c\u0435\u0445\u0430\u043d\u0438\u043a\u0438.<\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0421\u043e\u0432\u043c\u0435\u0449\u0435\u043d\u0438\u0435, \u0441\u043b\u0438\u044f\u043d\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438<\/title>\r\n <style>\r\n .img {\r\n line-height: 1px; \/* \u041c\u0435\u0436\u0441\u0442\u0440\u043e\u0447\u043d\u043e\u0435 \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u0435 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p class="img"><img src="images\/ecctitle.png" alt="\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435"\r\n width="640" height="158"><br>\r\n <img src="images\/navigate.png" alt="\u041d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f" width="640" height="30"><\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0438\u043b\u0438<\/p>\n
\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438<\/title>\r\n <style>\r\n .center {\r\n margin: 0 auto; \/* \u0412\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u0431\u043b\u043e\u043a\u0430 \u043f\u043e \u0446\u0435\u043d\u0442\u0440\u0443 *\/\r\n width: 640px; \/* \u0428\u0438\u0440\u0438\u043d\u0430 \u0431\u043b\u043e\u043a\u0430 *\/\r\n line-height: 1px; \/* \u041c\u0435\u0436\u0441\u0442\u0440\u043e\u0447\u043d\u043e\u0435 \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u0435 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <div class="center">\r\n <img src="images\/ecctitle.png" alt="\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435" width="640" height="158">\r\n <img src="images\/navigate.png" alt="\u041d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f" width="640" height="30">\r\n <\/div>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0421\u043e\u0432\u043c\u0435\u0449\u0435\u043d\u0438\u0435, \u0441\u043b\u0438\u044f\u043d\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u043f\u043e \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u0438<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u0438<\/title>\r\n <\/head>\r\n <body>\r\n <p>\r\n <img src="images\/thumb1.jpg" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f 1" width="120" height="120">\r\n <img src="images\/thumb2.jpg" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f 2" width="120" height="120">\r\n <img src="images\/thumb3.jpg" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f 3" width="120" height="120">\r\n <img src="images\/thumb4.jpg" alt="\u0424\u043e\u0442\u043e\u0433\u0440\u0430\u0444\u0438\u044f 4" width="120" height="120">\r\n <\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u041e\u0442\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/span><\/h2>\ntransform: scale(-1, 1) \u2014 \u043e\u0442\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u0438;
\ntransform: scale(1, -1) \u2014 \u043e\u0442\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438;
\ntransform: scale(-1, -1) \u2014 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0435 \u043e\u0442\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u0438 \u0438 \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438<\/p>\n
\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u041e\u0442\u0440\u0430\u0436\u0435\u043d\u0438\u0435<\/title>\r\n <style>\r\n .mirrorY { transform: scale(1, -1); }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <img src="images\/spam.jpg" alt="\u0421\u043f\u0430\u043c">\r\n <img src="images\/spam.jpg" alt="\u0421\u043f\u0430\u043c" class="mirrorY">\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0417\u0430\u043c\u0435\u043d\u0430 \u0442\u0435\u043a\u0441\u0442\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435\u043c, \u0441\u043f\u0440\u044f\u0442\u0430\u0442\u044c \u0442\u0435\u043a\u0441\u0442 \u0438 \u0432\u044b\u0432\u0435\u0441\u0442\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0417\u0430\u043c\u0435\u043d\u0430 \u0442\u0435\u043a\u0441\u0442\u0430<\/title>\r\n <style>\r\n h1, h2 {\r\n overflow: hidden; \/* \u0421\u043a\u0440\u044b\u0432\u0430\u0435\u0442 \u043e\u0431\u043b\u0430\u0441\u0442\u044c *\/\r\n height: 0; \/* \u041d\u0443\u043b\u0435\u0432\u0430\u044f \u0432\u044b\u0441\u043e\u0442\u0430 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 *\/\r\n }\r\n h1 {\r\n background: url(images\/head1.png) no-repeat; \/* \u0424\u043e\u043d\u043e\u0432\u044b\u0439 \u0440\u0438\u0441\u0443\u043d\u043e\u043a \u0434\u043b\u044f \u0437\u0430\u043c\u0435\u043d\u044b \u0442\u0435\u043a\u0441\u0442\u0430 *\/\r\n padding-top: 54px; \/* \u0412\u044b\u0441\u043e\u0442\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f *\/\r\n }\r\n h2 {\r\n background: url(images\/head2.png) no-repeat;\r\n padding-top: 28px;\r\n margin-bottom: 0;\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <h1>\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u0411\u0435\u043b\u043e\u0441\u043d\u0435\u0436\u043a\u0438<\/h1>\r\n <p>\u0421\u0442\u043e\u043b\u043a\u043d\u0443\u0432\u0448\u0438\u0441\u044c \u0441\u043e \u0441\u043b\u043e\u0436\u043d\u043e\u0439 \u0437\u0430\u0434\u0430\u0447\u0435\u0439 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043f\u043e\u043b\u043d\u043e\u043c\u0435\u0442\u0440\u0430\u0436\u043d\u043e\u0433\u043e\r\n \u043c\u0443\u043b\u044c\u0442\u0444\u0438\u043b\u044c\u043c\u0430, \u0414\u0438\u0441\u043d\u0435\u0439 \u043f\u043e\u043d\u0438\u043c\u0430\u043b, \u0447\u0442\u043e \u0438\u043c\u0435\u044e\u0449\u0438\u0435\u0441\u044f \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0430 \u0435\u043c\u0443 \r\n \u043d\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0442.<\/p>\r\n <h2>\u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0435 \u0444\u0430\u043a\u0442\u044b<\/h2>\r\n <p>\u0423\u043e\u043b\u0442 \u0414\u0438\u0441\u043d\u0435\u0439 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u043e \u043d\u0435 \u0441\u043c\u043e\u0442\u0440\u0435\u043b \u043d\u0430 \u0430\u043a\u0442\u0440\u0438\u0441, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \r\n \u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043b\u0438\u0441\u044c \u043d\u0430 \u043e\u0437\u0432\u0443\u0447\u0438\u0432\u0430\u043d\u0438\u0435 \u0440\u043e\u043b\u0438 \u0411\u0435\u043b\u043e\u0441\u043d\u0435\u0436\u043a\u0438. \u0422\u0430\u043a \u043e\u043d \u043c\u043e\u0433 \u043e\u0431\u044a\u0435\u043a\u0442\u0438\u0432\u043d\u043e \r\n \u043e\u0446\u0435\u043d\u0438\u0442\u044c \u0433\u043e\u043b\u043e\u0441.<\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u043c\u044b\u0448\u0438, \u044d\u0444\u0444\u0435\u043a\u0442 \u043f\u0435\u0440\u0435\u043a\u0430\u0442\u044b\u0432\u0430\u043d\u0438\u044f<\/span><\/h2>\n\u0413\u043e\u0442\u043e\u0432\u044f\u0442\u0441\u044f \u0434\u0432\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430, \u043e\u0434\u043d\u043e \u0434\u043b\u044f \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u0432\u0438\u0434\u0430, \u0430 \u0432\u0442\u043e\u0440\u043e\u0435 \u2014 \u0434\u043b\u044f \u0435\u0433\u043e \u0437\u0430\u043c\u0435\u043d\u044b \u043f\u0440\u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u0435 \u043f\u0435\u0440\u0435\u043a\u0430\u0442\u044b\u0432\u0430\u043d\u0438\u044f. \u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u0432\u0442\u043e\u0440\u043e\u0439 \u0440\u0438\u0441\u0443\u043d\u043e\u043a \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u043a\u0443\u0440\u0441\u043e\u0440\u0430 \u043d\u0430 \u0441\u0441\u044b\u043b\u043a\u0443, \u0442\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0438 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0441 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043f\u0430\u0443\u0437\u043e\u0439.<\/p>\n
\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u042d\u0444\u0444\u0435\u043a\u0442 \u043f\u0435\u0440\u0435\u043a\u0430\u0442\u044b\u0432\u0430\u043d\u0438\u044f<\/title>\r\n <style>\r\n a.rollover {\r\n background: url(images\/sun1.png); \/* \u041f\u0443\u0442\u044c \u043a \u0444\u0430\u0439\u043b\u0443 \u0441 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u043c \u0440\u0438\u0441\u0443\u043d\u043a\u043e\u043c *\/\r\n display: block; \/* \u0420\u0438\u0441\u0443\u043d\u043e\u043a \u043a\u0430\u043a \u0431\u043b\u043e\u0447\u043d\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 *\/\r\n width: 196px; \/* \u0428\u0438\u0440\u0438\u043d\u0430 \u0440\u0438\u0441\u0443\u043d\u043a\u0430 *\/\r\n height: 183px; \/* \u0412\u044b\u0441\u043e\u0442\u0430 \u0440\u0438\u0441\u0443\u043d\u043a\u0430 *\/\r\n }\r\n a.rollover:hover {\r\n background: url(images\/sun2.png); \/* \u041f\u0443\u0442\u044c \u043a \u0444\u0430\u0439\u043b\u0443 \u0441 \u0437\u0430\u043c\u0435\u043d\u044f\u0435\u043c\u044b\u043c \u0440\u0438\u0441\u0443\u043d\u043a\u043e\u043c *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p><a href="#" class="rollover"> <\/a><\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u043c\u044b\u0448\u0438, \u044d\u0444\u0444\u0435\u043a\u0442 \u043f\u0435\u0440\u0435\u043a\u0430\u0442\u044b\u0432\u0430\u043d\u0438\u044f \u0441 \u043e\u0434\u043d\u0438\u043c \u0440\u0438\u0441\u0443\u043d\u043a\u043e\u043c<\/span><\/h2>\n\u0421\u043c\u0435\u043d\u0430 \u043e\u0434\u043d\u043e\u0433\u043e \u0440\u0438\u0441\u0443\u043d\u043a\u0430 \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u0439 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0441\u0434\u0432\u0438\u0433\u043e\u043c \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438 \u0437\u0430 \u0441\u0447\u0451\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0443\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 background \u0438\u043b\u0438 background-position. \u0414\u043b\u044f \u0441\u0435\u043b\u0435\u043a\u0442\u043e\u0440\u0430 A \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0444\u043e\u043d\u043e\u0432\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e background, \u0448\u0438\u0440\u0438\u043d\u0430 (width) \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u0435\u0442 \u0441 \u0440\u0438\u0441\u0443\u043d\u043a\u043e\u043c, \u0430 \u0432\u044b\u0441\u043e\u0442\u0430 (\u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e height) \u0440\u0430\u0432\u043d\u0430 \u043f\u043e\u043b\u043e\u0432\u0438\u043d\u0435 \u0432\u044b\u0441\u043e\u0442\u044b \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f.<\/p>\n\n
\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u042d\u0444\u0444\u0435\u043a\u0442 \u043f\u0435\u0440\u0435\u043a\u0430\u0442\u044b\u0432\u0430\u043d\u0438\u044f<\/title>\r\n <style>\r\n a.rollover {\r\n background: url(images\/mark.png); \/* \u041f\u0443\u0442\u044c \u043a \u0444\u0430\u0439\u043b\u0443 \u0441 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u043c \u0440\u0438\u0441\u0443\u043d\u043a\u043e\u043c *\/\r\n display: block; \/* \u0420\u0438\u0441\u0443\u043d\u043e\u043a \u043a\u0430\u043a \u0431\u043b\u043e\u0447\u043d\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 *\/\r\n width: 151px; \/* \u0428\u0438\u0440\u0438\u043d\u0430 \u0440\u0438\u0441\u0443\u043d\u043a\u0430 \u0432 \u043f\u0438\u043a\u0441\u0435\u043b\u0430\u0445 *\/\r\n height: 40px; \/* \u0412\u044b\u0441\u043e\u0442\u0430 \u0440\u0438\u0441\u0443\u043d\u043a\u0430 *\/\r\n }\r\n a.rollover:hover {\r\n background-position: 0 -40px; \/* \u0421\u043c\u0435\u0449\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u0430 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p><a href="link.html" class="rollover"><\/a><\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u041f\u043e\u043b\u0443\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u041f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c<\/title>\r\n <style>\r\n .transparent75 {\r\n filter: alpha(Opacity=75); \/* \u041f\u043e\u043b\u0443\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c \u0434\u043b\u044f IE *\/\r\n opacity: 0.75; \/* \u041f\u043e\u043b\u0443\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c \u0434\u043b\u044f \u0434\u0440\u0443\u0433\u0438\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 *\/ \r\n }\r\n .transparent50 {\r\n filter: alpha(Opacity=50);\r\n opacity: 0.5; \r\n }\r\n .transparent25 {\r\n filter: alpha(Opacity=25);\r\n opacity: 0.25; \r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p>\r\n <img src="images\/cat.jpg" alt="\u041e\u0440\u0438\u0433\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435" \r\n width="250" height="243">\r\n <img src="images\/cat.jpg" alt="\u041d\u0435\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c 75%" \r\n width="250" height="243" class="transparent75">\r\n <img src="images\/cat.jpg" alt="\u041d\u0435\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c 50%" \r\n width="250" height="243" class="transparent50">\r\n <img src="images\/cat.jpg" alt="\u041d\u0435\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c 25%" \r\n width="250" height="243" class="transparent25">\r\n <\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0414\u0432\u0430 \u0444\u043e\u043d\u043e\u0432\u044b\u0445 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0434\u043b\u044f div \u0441\u043b\u0435\u0432\u0430 \u0438 \u0441\u043f\u0440\u0430\u0432\u0430<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0414\u0432\u0430 \u0444\u043e\u043d\u043e\u0432\u044b\u0445 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/title>\r\n <style>\r\n body {\r\n background: #f2f0e3; \/* \u0426\u0432\u0435\u0442 \u0444\u043e\u043d\u0430 \u0432\u0435\u0431-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b *\/ \r\n }\r\n .block {\r\n background: url(images\/bg_left.gif) repeat-y,\r\n #fff url(images\/bg_right.gif) repeat-y 100% 0; \r\n padding: 10px; \/* \u041f\u043e\u043b\u044f \u0432\u043e\u043a\u0440\u0443\u0433 \u0442\u0435\u043a\u0441\u0442\u0430 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <div class="block">\r\n \u0417\u0430 11 \u043c\u0435\u0441\u044f\u0446\u0435\u0432 \u0432\u0430\u0445\u0442\u044b \u0440\u0430\u0434\u0438\u0441\u0442\u044b \u043f\u0440\u043e\u0432\u0435\u043b\u0438 8642 \u0441\u0435\u0430\u043d\u0441\u043e\u0432 \u0441\u0432\u044f\u0437\u0438 \u043e\u0431\u0449\u0438\u043c \r\n \u043e\u0431\u044a\u0435\u043c\u043e\u043c 300625 \u0433\u0440\u0443\u043f\u043f. \u042d\u0442\u043e \u0442\u043e\u043b\u044c\u043a\u043e \u043c\u0435\u0442\u0435\u043e \u0438 \u0430\u044d\u0440\u043e\u0442\u0435\u043b\u0435\u0433\u0440\u0430\u043c\u043c\u044b. \r\n \u041f\u0440\u0438\u043d\u044f\u0442\u043e \u043e\u0442 \u0440\u0430\u0434\u0438\u043e\u0441\u0442\u0430\u043d\u0446\u0438\u0438 \u043c\u044b\u0441 \u0427\u0435\u043b\u044e\u0441\u043a\u0438\u043d 7450 \u0433\u0440\u0443\u043f\u043f.\r\n <\/div>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0424\u043e\u043d \u043b\u044e\u0431\u043e\u0433\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043d\u0430 \u0432\u0441\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0420\u0430\u0441\u0442\u044f\u0433\u0438\u0432\u0430\u0435\u043c\u044b\u0439 \u0444\u043e\u043d<\/title>\r\n <style>\r\n body {\r\n background: url(images\/sun2.png) no-repeat;\r\n -moz-background-size: 100%; \/* Firefox 3.6+ *\/\r\n -webkit-background-size: 100%; \/* Safari 3.1+ \u0438 Chrome 4.0+ *\/\r\n -o-background-size: 100%; \/* Opera 9.6+ *\/\r\n background-size: 100%; \/* \u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0414\u0432\u0430 \u0444\u043e\u043d\u043e\u0432\u044b\u0445 \u043b\u044e\u0431\u044b\u0445 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u043d\u0430 \u0432\u0441\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0441\u043b\u0435\u0432\u0430 \u0438 \u0441\u043f\u0440\u0430\u0432\u0430<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u0414\u0432\u0430 \u0444\u043e\u043d\u043e\u0432\u044b\u0445 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/title>\r\n <style>\r\n html {\r\n background: #fc0 url(images\/bgleft.png) repeat-y; \/* \u0426\u0432\u0435\u0442 \u0444\u043e\u043d\u0430 \u0432\u0435\u0431-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b,\r\n \u043f\u0443\u0442\u044c \u043a \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u043e\u043c\u0443 \u0444\u0430\u0439\u043b\u0443 \u0441 \u0444\u043e\u043d\u043e\u043c \u0438\r\n \u043f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u0430 \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438 *\/\r\n height: 100%; \/* \u0412\u044b\u0441\u043e\u0442\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 *\/\r\n }\r\n body {\r\n background: url(images\/bgright.png) repeat-y 100% 0; \/* \u041f\u0443\u0442\u044c \u043a \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u043e\u043c\u0443 \u0444\u0430\u0439\u043b\u0443 \u0441 \u0444\u043e\u043d\u043e\u043c,\r\n \u043f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u0430 \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438,\r\n \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0438 \u043f\u043e \r\n \u043f\u0440\u0430\u0432\u043e\u043c\u0443 \u043a\u0440\u0430\u044e \u043e\u043a\u043d\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 *\/\r\n margin: 0; \/* \u041e\u0431\u043d\u0443\u043b\u044f\u0435\u043c \u043e\u0442\u0441\u0442\u0443\u043f\u044b \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 *\/\r\n height: 100%; \/* \u0412\u044b\u0441\u043e\u0442\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 *\/\r\n }\r\n p {\r\n margin: 0; \/* \u041e\u0431\u043d\u0443\u043b\u044f\u0435\u043c \u043e\u0442\u0441\u0442\u0443\u043f\u044b *\/\r\n padding: 5px 0 0 20px; \/* \u041f\u043e\u043b\u044f \u0432\u043e\u043a\u0440\u0443\u0433 \u0442\u0435\u043a\u0441\u0442\u0430 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p>\u0421\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u0432\u0435\u0431-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u041f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u0430 \u0432\u0441\u0435\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head> \r\n <meta charset="utf-8">\r\n <title>\u041f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u0430 \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438<\/title>\r\n <style>\r\n body {\r\n padding-left: 100px; \/* \u041f\u043e\u043b\u0435 \u0441\u043b\u0435\u0432\u0430 *\/\r\n background: \r\n url(images\/pattern-left.png) repeat-y; \/* \u041f\u0443\u0442\u044c \u043a \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u043e\u043c\u0443 \u0444\u0430\u0439\u043b\u0443 \u0438\r\n \u043f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u0430 \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438 *\/ \r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p>\u0427\u0435\u043b\u043e\u0432\u0435\u043a \u0434\u043e\u043b\u0436\u0435\u043d \u0443\u043c\u0435\u0442\u044c \u0438\u043d\u043e\u0433\u0434\u0430 \u043f\u043e\u0441\u043c\u0435\u044f\u0442\u044c\u0441\u044f \u043d\u0430\u0434 \u0441\u043e\u0431\u043e\u0439, \u0438\u043d\u0430\u0447\u0435 \r\n \u043e\u043d \u0441\u043e\u0439\u0434\u0451\u0442 \u0441 \u0443\u043c\u0430. \u041e\u0431 \u044d\u0442\u043e\u043c, \u043a \u0441\u043e\u0436\u0430\u043b\u0435\u043d\u0438\u044e, \u0437\u043d\u0430\u044e\u0442 \u043d\u0435\u043c\u043d\u043e\u0433\u0438\u0435, \r\n \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432 \u043c\u0438\u0440\u0435 \u0442\u0430\u043a \u043c\u043d\u043e\u0433\u043e \u0441\u0443\u043c\u0430\u0441\u0448\u0435\u0434\u0448\u0438\u0445.<\/p>\r\n <p>\u0420\u0430\u0444\u0430\u044d\u043b\u044c \u0421\u0430\u0431\u0430\u0442\u0438\u043d\u0438<\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u041e\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u0430 \u0432\u0441\u0435\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head> \r\n <meta charset="utf-8">\r\n <title>\u0424\u043e\u043d<\/title>\r\n <style>\r\n body {\r\n background: url(images\/bg2.png) no-repeat; \/* \u041f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0444\u043e\u043d\u0430 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <p>\u0421\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u0432\u0435\u0431-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0424\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0444\u043e\u043d\u043e\u0432\u043e\u0433\u043e \u0440\u0438\u0441\u0443\u043d\u043a\u0430 \u0432 \u0443\u0433\u043b\u0443 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/span><\/h2>\n\r\n<!DOCTYPE html>\r\n<html>\r\n <head>\r\n <meta charset="utf-8">\r\n <title>\u041f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u043e\u0432\u043e\u0433\u043e \u0440\u0438\u0441\u0443\u043d\u043a\u0430<\/title>\r\n <style>\r\n html {\r\n height: 100%; \/* \u0412\u044b\u0441\u043e\u0442\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b *\/\r\n } \r\n body {\r\n background: \r\n url(images\/tomatos.jpg) right bottom no-repeat; \/* \u041f\u0443\u0442\u044c \u043a \u0444\u0430\u0439\u043b\u0443 \u0441 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435\u043c,\r\n \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432 \u043f\u0440\u0430\u0432\u043e\u043c \u043d\u0438\u0436\u043d\u0435\u043c \u0443\u0433\u043b\u0443\r\n \u0438 \u043e\u0442\u043c\u0435\u043d\u0430 \u043f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u044f \u0444\u043e\u043d\u0430 *\/\r\n margin-right: 200px; \/* \u041e\u0442\u0441\u0442\u0443\u043f \u0441\u043f\u0440\u0430\u0432\u0430 *\/\r\n }\r\n <\/style>\r\n <\/head>\r\n <body>\r\n <h1>\u041a\u043e\u043d\u0441\u0435\u0440\u0432\u044b \u0438\u0437 \u043f\u043e\u043c\u0438\u0434\u043e\u0440<\/h1>\r\n <p>\u041f\u043b\u043e\u0434\u044b \u043e\u0442\u0431\u0438\u0440\u0430\u044e\u0442 \u0441 \u0445\u043e\u0440\u043e\u0448\u0435\u0439 \u0440\u043e\u0432\u043d\u043e\u0439 \u043e\u043a\u0440\u0430\u0441\u043a\u043e\u0439, \u043f\u043b\u043e\u0442\u043d\u044b\u0435 \u0438 \u043e\u0434\u043d\u043e\u0440\u043e\u0434\u043d\u044b\u0435 \u043f\u043e \r\n \u0440\u0430\u0437\u043c\u0435\u0440\u0443, \u0443\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u044e\u0442 \u0432 \u0431\u0430\u043d\u043a\u0438 \u0438 \u0437\u0430\u043b\u0438\u0432\u0430\u044e\u0442 \u043a\u0438\u043f\u044f\u0449\u0438\u043c \u0440\u0430\u0441\u0441\u043e\u043b\u043e\u043c (\u043d\u0430 1 \u043b \u0432\u043e\u0434\u044b - 35 \u0433 \r\n \u043f\u043e\u0432\u0430\u0440\u0435\u043d\u043d\u043e\u0439 \u0441\u043e\u043b\u0438 \u0438 6 \u0433 \u043b\u0438\u043c\u043e\u043d\u043d\u043e\u0439 \u043a\u0438\u0441\u043b\u043e\u0442\u044b). \u0411\u0430\u043d\u043a\u0438 \u043f\u0440\u0438\u043a\u0440\u044b\u0432\u0430\u044e\u0442 \u043a\u0440\u044b\u0448\u043a\u0430\u043c\u0438 \u0438 \r\n \u0441\u0442\u0430\u0432\u044f\u0442 \u043d\u0430 \u043f\u0440\u043e\u0433\u0440\u0435\u0432\u0430\u043d\u0438\u0435, \u0432\u044b\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u044f \u0432 \u043a\u0438\u043f\u044f\u0449\u0435\u0439 \u0432\u043e\u0434\u0435: \u043b\u0438\u0442\u0440\u043e\u0432\u044b\u0435 - 5-8, \r\n \u0442\u0440\u0435\u0445\u043b\u0438\u0442\u0440\u043e\u0432\u044b\u0435 - 12-15 \u043c\u0438\u043d. \u0417\u0430\u0442\u0435\u043c \u0438\u0445 \u0443\u043a\u0443\u043f\u043e\u0440\u0438\u0432\u0430\u044e\u0442 \u0438 \u043e\u0445\u043b\u0430\u0436\u0434\u0430\u044e\u0442.<\/p>\r\n <p>\u041f\u0440\u0438\u043c\u0435\u0440\u043d\u044b\u0439 \u0440\u0430\u0441\u0445\u043e\u0434 \u0441\u044b\u0440\u044c\u044f \u0438 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u043d\u0430 \u043b\u0438\u0442\u0440\u043e\u0432\u0443\u044e \u0431\u0430\u043d\u043a\u0443: \u043f\u043e\u043c\u0438\u0434\u043e\u0440\u043e\u0432 \r\n \u043a\u0440\u0430\u0441\u043d\u044b\u0445 \u043e\u0442\u0431\u043e\u0440\u043d\u044b\u0445 - 550-600 \u0433, \u0441\u043e\u043b\u0438 - 15 \u0433, \u043b\u0438\u043c\u043e\u043d\u043d\u043e\u0439 \u043a\u0438\u0441\u043b\u043e\u0442\u044b - 3 \u0433.<\/p>\r\n <\/body>\r\n<\/html>\r\n<\/pre>\n\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f \u0432 \u043d\u0430\u0447\u0430\u043b\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0442\u043b\u043e\u0436\u0438\u0442\u044c \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0443 \u0434\u043e \u043c\u043e\u043c\u0435\u043d\u0442\u0430, \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0432 \u0438\u0445 \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0438<\/span><\/h2>\n\r\n<img src="example.jpg" alt="\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435" loading="lazy">\r\n<\/pre>\n\u0412\u0435\u0440\u0441\u0438\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u0440\u0430\u0437\u043d\u043e\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u0434\u043b\u044f \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432<\/span><\/h2>\n\r\n<img src="default.jpg" \r\n alt="\u0410\u0434\u0430\u043f\u0442\u0438\u0432\u043d\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435"\r\n srcset="small.jpg 320w, medium.jpg 480w, large.jpg 800w"\r\n sizes="(max-width: 320px) 280px, (max-width: 480px) 440px, 800px"\r\n>\r\n<\/pre>\n\u0438\u043b\u0438 \u0442\u0430\u043a<\/p>\n
\r\n<img\r\n srcset="\r\n elva-fairy-320w.jpg 320w,\r\n elva-fairy-480w.jpg 480w,\r\n elva-fairy-800w.jpg 800w\r\n "\r\n sizes="(max-width: 320px) 280px,\r\n (max-width: 480px) 440px,\r\n 800px"\r\n src="elva-fairy-800w.jpg"\r\n alt="Elva dressed as a fairy" \/>\r\n<\/pre>\n\u0422\u0435\u0433 picture \u0441 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u043e\u0439 \u0440\u0430\u0437\u043d\u044b\u0445 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u0434\u043b\u044f \u0440\u0430\u0437\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432<\/span><\/h2>\n\u0412 \u0442\u0435\u0433\u0435 picture \u0440\u0430\u0437\u043c\u0435\u0449\u0430\u0435\u043c \u0442\u0435\u0433 source \u0434\u043b\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u0432 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439. \u0423 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0442\u0435\u0433\u0430 source \u0435\u0441\u0442\u044c \u0430\u0442\u0440\u0438\u0431\u0443\u0442 srcset, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043f\u0443\u0442\u044c \u043a \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044e. \u0410\u0442\u0440\u0438\u0431\u0443\u0442 media \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442 \u0443\u0441\u043b\u043e\u0432\u0438\u044f, \u043f\u0440\u0438 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c\u0441\u044f \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, media=»(min-width: 1200px)» \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 logotype-desktop.svg \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c\u0441\u044f, \u0435\u0441\u043b\u0438 \u0448\u0438\u0440\u0438\u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0430 \u0440\u0430\u0432\u043d\u0430 \u0438\u043b\u0438 \u0431\u043e\u043b\u044c\u0448\u0435 1200px. \u0412 \u043a\u043e\u043d\u0446\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442 img, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0432 \u0441\u043b\u0443\u0447\u0430\u0435, \u0435\u0441\u043b\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u043d\u0435 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0442\u0435\u0433 picture \u0438\u043b\u0438 \u043d\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u043d\u0438 \u043e\u0434\u043d\u043e \u0438\u0437 \u0443\u0441\u043b\u043e\u0432\u0438\u0439, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u0445 \u0432 \u0442\u0435\u0433\u0430\u0445 source. \u0417\u0434\u0435\u0441\u044c \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u043f\u0443\u0442\u044c \u043a \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044e img\/logotype-phone.svg \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0439 \u0442\u0435\u043a\u0441\u0442 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430 alt.<\/p>\n\n
\r\n<picture>\r\n <source media="(min-width: 1200px)" srcset="img\/logotype-desktop.svg">\r\n <source media="(min-width: 768px)" srcset="img\/logotype-tablet.svg">\r\n <img src="img\/logotype-phone.svg" width="226" height="30" alt="\u0411\u0430\u0440\u0431\u0435\u0440\u0448\u043e\u043f \r\n \u00ab\u0411\u043e\u0440\u043e\u0434\u0438\u043d\u0441\u043a\u0438\u0439\u00bb.">\r\n<\/picture>\r\n<\/pre>\n\u0422\u0435\u0433 picture \u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u044d\u043a\u0440\u0430\u043d\u0430 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430<\/span><\/h2>\n\r\n<picture>\r\n\t<source\r\n\t\ttype="image\/webp"\r\n\t\tsrcset="my-photo-lg.webp 1200w,\r\n\t\t\t\tmy-photo-md.webp 800w,\r\n\t\t\t\tmy-photo-sm.webp 500w"\r\n\t\tsizes="(max-width: 800px) 90vw, (max-width: 500px) 70vw, 50vw"\r\n\t>\r\n\r\n\t<img\r\n\t\tsrcset="my-photo-lg.jpg 1200w,\r\n\t\t\t\tmy-photo-md.jpg 800w,\r\n\t\t\t\tmy-photo-sm.jpg 500w"\r\n\t\tsizes="(max-width: 800px) 90vw, (max-width: 500px) 70vw, 50vw"\r\n\t\tsrc="my-photo-lg.jpg"\r\n\t\twidth="280" height="460"\r\n\t>\r\n<\/picture>\r\n<\/pre>\n\u0418 \u0441\u043d\u043e\u0432\u0430 \u043f\u0440\u0438\u043c\u0435\u0440 \u0444\u043e\u043d\u043e\u0432\u043e\u0433\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0431\u043b\u043e\u043a\u0430<\/span><\/h2>\n\r\n.image-container {\r\n background-image: url("images\/keks.jpg");\r\n width: 600px;\r\n height: 400px;\r\n}\r\n<\/pre>\nscroll \u2014 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e. \u0424\u043e\u043d \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u044b\u043c.
\nfix \u2014 \u0444\u043e\u043d \u0444\u0438\u043a\u0441\u0438\u0440\u0443\u0435\u0442\u0441\u044f.
\nlocal \u2014 \u0444\u043e\u043d \u0444\u0438\u043a\u0441\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0441 \u0443\u0447\u0451\u0442\u043e\u043c \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430.<\/p>\n
background-position \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c \u0444\u043e\u043d\u0430 \u043f\u043e \u043e\u0441\u044f\u043c X \u0438 Y, \u0442\u043e \u0435\u0441\u0442\u044c \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438 \u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u0438. \u0415\u043c\u0443 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0441\u043b\u043e\u0432\u0430, \u043f\u0440\u043e\u0446\u0435\u043d\u0442\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438\u043b\u0438 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0435 \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u044b, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, 100px. \u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0441\u043b\u043e\u0432\u0430 \u0434\u043b\u044f \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u043e \u043e\u0441\u0438 X:
\nright \u2014 \u043f\u0440\u0430\u0432\u043e;
\nleft \u2014 \u043b\u0435\u0432\u043e.<\/p>\n
\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0441\u043b\u043e\u0432\u0430 \u0434\u043b\u044f \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u043e \u043e\u0441\u0438 Y:
\ntop \u2014 \u0441\u0432\u0435\u0440\u0445\u0443;
\nbottom \u2014 \u0441\u043d\u0438\u0437\u0443.<\/p>\n
\u041c\u043e\u0436\u043d\u043e \u0441\u043e\u0447\u0435\u0442\u0430\u0442\u044c \u0440\u0430\u0437\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f:
\nbackground-position: 100px top; \/* \u0444\u043e\u043d \u043e\u0442\u0441\u0442\u0443\u043f\u0438\u0442 100px \u043e\u0442 \u043b\u0435\u0432\u043e\u0433\u043e \u043a\u0440\u0430\u044f, \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u0441\u0432\u0435\u0440\u0445\u0443*\/
\nbackground-position: 50% bottom; \/* \u0444\u043e\u043d \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0441\u0435\u0440\u0435\u0434\u0438\u043d\u0435 \u0438 \u0441\u043d\u0438\u0437\u0443*\/
\nbackground-position: left 100px; \/* \u0444\u043e\u043d \u0431\u0443\u0434\u0435\u0442 \u0441\u043b\u0435\u0432\u0430 \u0438 \u043e\u0442\u0441\u0442\u0443\u043f\u0438\u0442 100px \u043e\u0442 \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u043a\u0440\u0430\u044f*\/ <\/p>\n
\u0415\u0441\u043b\u0438 \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0442\u044c \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e \u043e\u0434\u043d\u043e\u0439 \u043e\u0441\u0438, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 background-position-x \u0438 background-position-y. \u041e\u043d\u0438 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u044e\u0442 \u0442\u0430\u043a\u0438\u0435 \u0436\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u043a\u0430\u043a \u0438 background-position.<\/p>\n
\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0435 CSS-\u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e \u2014 background-repeat, \u043e\u043d\u043e \u0437\u0430\u0434\u0430\u0451\u0442 \u043f\u043e\u0432\u0442\u043e\u0440 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f. \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0443 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0441\u0442\u043e\u0438\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 repeat, \u0442\u043e \u0435\u0441\u0442\u044c \u0444\u043e\u043d\u043e\u0432\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0435\u0442\u0441\u044f \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438 \u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u0438:
\nno-repeat \u2014 \u043d\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0442\u044c \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435,
\nrepeat-x \u2014 \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u0438
\nrepeat-y \u2014 \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u0438.<\/p>\n
background-size \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0440\u0430\u0437\u043c\u0435\u0440\u044b \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f. \u0415\u043c\u0443 \u0442\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0432 \u0432\u0438\u0434\u0435 \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0445 \u0441\u043b\u043e\u0432, \u043f\u0440\u043e\u0446\u0435\u043d\u0442\u043e\u0432 \u0438\u043b\u0438 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0445 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432.
\nbackground-size: \/*\u0440\u0430\u0437\u043c\u0435\u0440 \u043f\u043e \u0448\u0438\u0440\u0438\u043d\u0435*\/ \/*\u0440\u0430\u0437\u043c\u0435\u0440 \u043f\u043e \u0432\u044b\u0441\u043e\u0442\u0435*\/
\n\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0441\u043b\u043e\u0432\u0430:
\nauto \u2014 \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u0440\u0430\u0437\u043c\u0435\u0440 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f.
\ncontain \u2014 \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u0443\u0435\u0442 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u0448\u0438\u0440\u0438\u043d\u0435 \u0438\u043b\u0438 \u0432\u044b\u0441\u043e\u0442\u0435, \u0447\u0442\u043e\u0431\u044b \u043e\u043d\u043e \u0437\u0430\u043f\u043e\u043b\u043d\u0438\u043b\u043e \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440. \u041a\u0430\u0440\u0442\u0438\u043d\u043a\u0430 \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u043d\u0435 \u043e\u0431\u0440\u0435\u0437\u0430\u0435\u0442\u0441\u044f.
\ncover \u2014 \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u0443\u0435\u0442 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435, \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044f \u043f\u0440\u043e\u043f\u043e\u0440\u0446\u0438\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f. \u041a\u0430\u0440\u0442\u0438\u043d\u043a\u0430 \u043c\u043e\u0436\u0435\u0442 \u043e\u0431\u0440\u0435\u0437\u0430\u0442\u044c\u0441\u044f.<\/p>\n
\u0422\u0435\u0433 figure<\/span><\/h2>\n\u0421 \u0438\u044e\u043b\u044f 2015 \u0433\u043e\u0434\u0430 \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0441\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u044e\u0442 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u0443\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u043e\u0433\u043e HTML-\u0442\u0435\u0433\u0430 figure, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e \u0432\u044b\u0432\u043e\u0434\u0430 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0441 \u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u043f\u043e\u0434\u043f\u0438\u0441\u044c\u044e, \u0438\u043d\u043e\u0433\u0434\u0430 \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u043c\u043e\u0439 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u043c. \u0412 \u043e\u0431\u0449\u0435\u043c \u0432\u0438\u0434\u0435 \u0442\u0435\u0433 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0443\u044e \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044e:<\/p>\n
\r\n<figure class="sign">\r\n <p><img src="images\/helen.jpg" width="150" height="212" alt="\u0421\u043a\u0443\u043b\u044c\u043f\u0442\u0443\u0440\u0430"><\/p>\r\n <figcaption>\u0414\u0435\u0440\u0435\u0432\u044f\u043d\u043d\u0430\u044f \u0441\u043a\u0443\u043b\u044c\u043f\u0442\u0443\u0440\u0430<\/figcaption>\r\n <\/figure>\r\n<\/pre>\n\u0412\u043d\u0443\u0442\u0440\u0438 \u0442\u0435\u0433\u0430 figure \u0434\u043e\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u0431\u043e\u043b\u0435\u0435 \u043e\u0434\u043d\u043e\u0433\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f:<\/p>\n
\r\n<figure>\r\n <img src="minsk.jpg" alt="\u0426\u0435\u043d\u0442\u0440 \u041c\u0438\u043d\u0441\u043a\u0430">\r\n <img src="vitebsk.jpg" alt="\u0412\u0438\u0442\u0435\u0431\u0441\u043a, \u043f\u043b\u043e\u0449\u0430\u0434\u044c \u0442\u044b\u0441\u044f\u0447\u0435\u043b\u0435\u0442\u0438\u044f" >\r\n <figcaption>\u0424\u043e\u0442\u043e \u0433\u043e\u0440\u043e\u0434\u043e\u0432 \u0411\u0435\u043b\u0430\u0440\u0443\u0441\u0438<\/figcaption>\r\n<\/figure>\r\n<\/pre>\n\u0421\u043e\u0432\u043c\u0435\u0441\u0442\u043d\u043e\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 figure \u0438 picture<\/span><\/h2>\n\r\n<figure>\r\n <picture>\r\n <source srcset="image-big.png" type="image\/png" media="(min-width: 1200px)"> \r\n <source srcset="image-medium.png" type="image\/png" media="(min-width: 768px)"> \r\n <img src="image-small.png" alt="\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f" class="img-fluid">\r\n <\/picture>\r\n <figcaption>\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u043a \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044e<\/figcaption>\r\n<\/figure>\r\n<\/pre>\n\n","protected":false},"excerpt":{"rendered":"\u0422\u0435\u0433 img \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0432\u0441\u0442\u0430\u0432\u043a\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u043d\u0430 \u0432\u0435\u0431-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b. \u0422\u0435\u0433 picture \u0441\u043b\u0443\u0436\u0438\u0442 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u043e\u043c \u0434\u043b\u044f \u043e\u0434\u043d\u043e\u0433\u043e \u0438\u043b\u0438 \u0431\u043e\u043b\u0435\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 source \u0438 \u043e\u0434\u043d\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 img \u0434\u043b\u044f \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0435\u043d\u0438\u044f \u043e\u043f\u0442\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432 \u044d\u043a\u0440\u0430\u043d\u0430. \u0422\u0435\u0433 figure \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e \u0432\u044b\u0432\u043e\u0434\u0430 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0441 \u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u043f\u043e\u0434\u043f\u0438\u0441\u044c\u044e, \u0438\u043d\u043e\u0433\u0434\u0430 \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u043c\u043e\u0439 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u043c.<\/p>\n","protected":false},"author":1,"featured_media":256,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8,7],"tags":[16,115,117,116],"class_list":{"0":"post-255","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-htmlverstka","8":"category-programmirovanie","9":"tag-css","10":"tag-figure","11":"tag-img","12":"tag-picture"},"_links":{"self":[{"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/posts\/255","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/comments?post=255"}],"version-history":[{"count":2,"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/posts\/255\/revisions"}],"predecessor-version":[{"id":279,"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/posts\/255\/revisions\/279"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/media\/256"}],"wp:attachment":[{"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/media?parent=255"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/categories?post=255"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/planeta21vek.ru\/elina732\/wp-json\/wp\/v2\/tags?post=255"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}