{"id":3137,"date":"2017-08-06T22:25:08","date_gmt":"2017-08-06T19:25:08","guid":{"rendered":"http:\/\/kamil-abzalov.com\/tutorials\/creating-simple-web-site-including-fonts-to-web-site\/"},"modified":"2020-04-08T19:51:52","modified_gmt":"2020-04-08T16:51:52","slug":"creating-simple-web-site-including-fonts-to-web-site","status":"publish","type":"post","link":"https:\/\/kamil-abzalov.com\/en\/tutorials\/html-css\/creating-simple-web-site-including-fonts-to-web-site\/","title":{"rendered":"Creating simple web site. Including fonts to web site"},"content":{"rendered":"

[et_pb_section fb_built=”1″ fullwidth=”on” _builder_version=”3.22″][et_pb_fullwidth_header title=”Creating simple web site. Including fonts to web site” content_max_width=”none” _builder_version=”3.16″ button_one_letter_spacing_hover=”0″ button_two_letter_spacing_hover=”0″ button_one_text_size__hover_enabled=”off” button_two_text_size__hover_enabled=”off” button_one_text_color__hover_enabled=”off” button_two_text_color__hover_enabled=”off” button_one_border_width__hover_enabled=”off” button_two_border_width__hover_enabled=”off” button_one_border_color__hover_enabled=”off” button_two_border_color__hover_enabled=”off” button_one_border_radius__hover_enabled=”off” button_two_border_radius__hover_enabled=”off” button_one_letter_spacing__hover_enabled=”on” button_one_letter_spacing__hover=”0″ button_two_letter_spacing__hover_enabled=”on” button_two_letter_spacing__hover=”0″ button_one_bg_color__hover_enabled=”off” button_two_bg_color__hover_enabled=”off”][\/et_pb_fullwidth_header][\/et_pb_section][et_pb_section fb_built=”1″ admin_label=”section” _builder_version=”3.22″][et_pb_row admin_label=”row” _builder_version=”3.25″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_padding=”0px|||”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_dcsbcm_divi_breadcrumbs_module homebreadcrumbtext=”Home” hide_currentbreadcrumb=”off” _builder_version=”4.4.2″ custom_padding=”0px|||” hover_enabled=”0″ fontsbreadcrumbs_font_size_tablet=”51″ fontsbreadcrumbs_line_height_tablet=”2″ fontsseperator_font_size_tablet=”51″ fontsseperator_line_height_tablet=”2″ fontsbreadcrumblinks_font_size_tablet=”51″ fontsbreadcrumblinks_line_height_tablet=”2″][\/et_pb_dcsbcm_divi_breadcrumbs_module][et_pb_text _builder_version=”3.27.4″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]In this lesson we will begin to create web site. First of all we begin to create header. Also I’ll show you how to include web fonts using google fonts<\/a> and webfont.ru<\/a>
\n[\/et_pb_text][et_pb_video src=”https:\/\/www.youtube.com\/watch?v=SRX3FFqY8vI” _builder_version=”3.0.47″][\/et_pb_video][et_pb_text _builder_version=”3.27.4″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]There are list of standard fonts:
\n1. Arial
\n2. Verdana
\n3. Times
\n4. Times New Roman
\n5. Georgia
\n6. Trebuchet MS
\n7. Sans
\n8. Sans
\n9. Comic Sans MS
\n10. Courier New
\n11. Webdings
\n12. Garamond
\n13. Helvetica<\/p>\n

Besides there are some standards fonts, which can’t work in some operation systems:
\n1. Palatino Linotype \/ Palatino
\n2. Tahoma
\n3. Impact
\n4. Century Gothic
\n5. Arial Black
\n6. Arial Narrow
\n7. Copperplate \/ Copperplate Gothic Light
\n8. Gill Sans \/ Gill Sans MT<\/p>\n

Also I talked how to remove default margins and paddings. For this purpose you need to use special css file – normalize.css<\/a>
\n[\/et_pb_text][et_pb_dmb_code_snippet title=”Code lesson (HTML)” code=”PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9InJ1Ij4KPGhlYWQ+CiAgICA8bWV0YSBjaGFyc2V0PSJVVEYtOCI+CiAgICA8dGl0bGU+RG9jdW1lbnQ8L3RpdGxlPgogICAgPGxpbmsgcmVsPSJzdHlsZXNoZWV0IiBocmVmPSJzdHlsZS5jc3MiPgogICAgPGxpbmsgcmVsPSJzdHlsZXNoZWV0IiBocmVmPSJodHRwczovL25lY29sYXMuZ2l0aHViLmlvL25vcm1hbGl6ZS5jc3MvMy4wLjIvbm9ybWFsaXplLmNzcyI+CiAgICA8IS0tPGxpbmsgaHJlZj0naHR0cHM6Ly9mb250cy5nb29nbGVhcGlzLmNvbS9jc3M\/ZmFtaWx5PVJvYm90byZzdWJzZXQ9bGF0aW4sY3lyaWxsaWMtZXh0JyByZWw9J3N0eWxlc2hlZXQnIHR5cGU9J3RleHQvY3NzJz4tLT4KPC9oZWFkPgo8Ym9keT4KCiAgICA8aGVhZGVyPgogICAgICAgIDxkaXYgY2xhc3M9IndyYXBwZXJIZWFkZXIiPgogICAgICAgICAgICA8ZGl2IGNsYXNzPSJsb2dvIj4KICAgICAgICAgICAgICAgIDxpbWcgc3JjPSJodHRwOi8va2FtaWwtYWJ6YWxvdi5ydS93cC1jb250ZW50L3RoZW1lcy9taWxsZW5pdW1TZWNvbmQvaW1nL2xvZ28ucG5nIiBhbHQ9IiI+CiAgICAgICAgICAgIDwvZGl2PgogICAgICAgICAgICA8ZGl2IGNsYXNzPSJwaG9uZSI+CiAgICAgICAgICAgICAgICA8cD4xMjMtNDUtNjc8L3A+CiAgICAgICAgICAgIDwvZGl2PgogICAgICAgICAgICA8ZGl2IGNsYXNzPSJzZWFyY2giPgogICAgICAgICAgICAgICAgPGZvcm0+CiAgICAgICAgICAgICAgICAgICAgPGlucHV0IHR5cGU9InRleHQiLz4KICAgICAgICAgICAgICAgICAgICA8aW5wdXQgdHlwZT0ic3VibWl0Ij4KICAgICAgICAgICAgICAgIDwvZm9ybT4KICAgICAgICAgICAgPC9kaXY+CiAgICAgICAgPC9kaXY+CiAgICA8L2hlYWRlcj4KCiAgICA8ZGl2IGlkPSJjb250ZW50Ij4KICAgICAgICBMb3JlbSBpcHN1bSBkb2xvciBzaXQgYW1ldCwgY29uc2VjdGV0dXIgYWRpcGlzaWNpbmcgZWxpdC4gRHVjaW11cyBmYWNpbGlzIGVzdCBuYW0sIGV4cGVkaXRhIGVhcXVlLiBJcHN1bSB2ZXJvIHNhcGllbnRlLCB0ZW5ldHVyIHZvbHVwdGFzIGFsaXF1aWQgYWNjdXNhbnRpdW0uIE1vbGVzdGlhZSBkaXN0aW5jdGlvIHJhdGlvbmUgY29tbW9kaSEgVmVsIG9mZmljaWlzIGxhYm9ydW0gdGVtcG9yaWJ1cyBudWxsYS4gTG9yZW0gaXBzdW0gZG9sb3Igc2l0IGFtZXQsIGNvbnNlY3RldHVyIGFkaXBpc2ljaW5nIGVsaXQuIEVzdCBtYXhpbWUgdmVsIG1vbGVzdGlhcyByZXByZWhlbmRlcml0LiBOaWhpbCBoaWMgcmVwcmVoZW5kZXJpdCBhc3BlcmlvcmVzIG9tbmlzIGFzc3VtZW5kYSB2b2x1cHRhdGlidXMgbW9kaSBzYWVwZSwgdGVuZXR1ciBuZWNlc3NpdGF0aWJ1cyBlcnJvciBwbGFjZWF0LCBmdWdpdCwgb2RpbyBpbXBlZGl0LiBFYXF1ZS4gTG9yZW0gaXBzdW0gZG9sb3Igc2l0IGFtZXQsIGNvbnNlY3RldHVyIGFkaXBpc2ljaW5nIGVsaXQuIFNvbHV0YSBxdWFlIHN1bnQsIGxhYm9yaW9zYW0gbW9sZXN0aWFzIGRlbGVuaXRpIG5hbSEgRW5pbSBleGVyY2l0YXRpb25lbSBkaWN0YSBtYXhpbWUgcGVyZmVyZW5kaXMgc2l0IGFjY3VzYW11cyBhbGlxdWlkIHF1aXNxdWFtIGRlYml0aXMgZmFjaWxpcyB2ZWxpdCwgZG9sb3JlbSBsaWJlcm8sIGZ1Z2lhdC4KICAgIDwvZGl2PgoKICAgIDxmb290ZXI+CgogICAgPC9mb290ZXI+Cgo8L2JvZHk+CjwvaHRtbD4=” admin_label=”\u041a\u043e\u0434 \u0443\u0440\u043e\u043a\u0430” style=”docco” linenums=”on” usetabwidth=”on” tabwidth=”4″ _builder_version=”4.4.2″ hover_enabled=”0″]PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9InJ1Ij4KPGhlYWQ+CiAgICA8bWV0YSBjaGFyc2V0PSJVVEYtOCI+CiAgICA8dGl0bGU+RG9jdW1lbnQ8L3RpdGxlPgogICAgPGxpbmsgcmVsPSJzdHlsZXNoZWV0IiBocmVmPSJzdHlsZS5jc3MiPgogICAgPGxpbmsgcmVsPSJzdHlsZXNoZWV0IiBocmVmPSJodHRwczovL25lY29sYXMuZ2l0aHViLmlvL25vcm1hbGl6ZS5jc3MvMy4wLjIvbm9ybWFsaXplLmNzcyI+CiAgICA8IS0tPGxpbmsgaHJlZj0naHR0cHM6Ly9mb250cy5nb29nbGVhcGlzLmNvbS9jc3M\/ZmFtaWx5PVJvYm90byZzdWJzZXQ9bGF0aW4sY3lyaWxsaWMtZXh0JyByZWw9J3N0eWxlc2hlZXQnIHR5cGU9J3RleHQvY3NzJz4tLT4KPC9oZWFkPgo8Ym9keT4KCiAgICA8aGVhZGVyPgogICAgICAgIDxkaXYgY2xhc3M9IndyYXBwZXJIZWFkZXIiPgogICAgICAgICAgICA8ZGl2IGNsYXNzPSJsb2dvIj4KICAgICAgICAgICAgICAgIDxpbWcgc3JjPSJodHRwOi8va2FtaWwtYWJ6YWxvdi5ydS93cC1jb250ZW50L3RoZW1lcy9taWxsZW5pdW1TZWNvbmQvaW1nL2xvZ28ucG5nIiBhbHQ9IiI+CiAgICAgICAgICAgIDwvZGl2PgogICAgICAgICAgICA8ZGl2IGNsYXNzPSJwaG9uZSI+CiAgICAgICAgICAgICAgICA8cD4xMjMtNDUtNjc8L3A+CiAgICAgICAgICAgIDwvZGl2PgogICAgICAgICAgICA8ZGl2IGNsYXNzPSJzZWFyY2giPgogICAgICAgICAgICAgICAgPGZvcm0+CiAgICAgICAgICAgICAgICAgICAgPGlucHV0IHR5cGU9InRleHQiLz4KICAgICAgICAgICAgICAgICAgICA8aW5wdXQgdHlwZT0ic3VibWl0Ij4KICAgICAgICAgICAgICAgIDwvZm9ybT4KICAgICAgICAgICAgPC9kaXY+CiAgICAgICAgPC9kaXY+CiAgICA8L2hlYWRlcj4KCiAgICA8ZGl2IGlkPSJjb250ZW50Ij4KICAgICAgICBMb3JlbSBpcHN1bSBkb2xvciBzaXQgYW1ldCwgY29uc2VjdGV0dXIgYWRpcGlzaWNpbmcgZWxpdC4gRHVjaW11cyBmYWNpbGlzIGVzdCBuYW0sIGV4cGVkaXRhIGVhcXVlLiBJcHN1bSB2ZXJvIHNhcGllbnRlLCB0ZW5ldHVyIHZvbHVwdGFzIGFsaXF1aWQgYWNjdXNhbnRpdW0uIE1vbGVzdGlhZSBkaXN0aW5jdGlvIHJhdGlvbmUgY29tbW9kaSEgVmVsIG9mZmljaWlzIGxhYm9ydW0gdGVtcG9yaWJ1cyBudWxsYS4gTG9yZW0gaXBzdW0gZG9sb3Igc2l0IGFtZXQsIGNvbnNlY3RldHVyIGFkaXBpc2ljaW5nIGVsaXQuIEVzdCBtYXhpbWUgdmVsIG1vbGVzdGlhcyByZXByZWhlbmRlcml0LiBOaWhpbCBoaWMgcmVwcmVoZW5kZXJpdCBhc3BlcmlvcmVzIG9tbmlzIGFzc3VtZW5kYSB2b2x1cHRhdGlidXMgbW9kaSBzYWVwZSwgdGVuZXR1ciBuZWNlc3NpdGF0aWJ1cyBlcnJvciBwbGFjZWF0LCBmdWdpdCwgb2RpbyBpbXBlZGl0LiBFYXF1ZS4gTG9yZW0gaXBzdW0gZG9sb3Igc2l0IGFtZXQsIGNvbnNlY3RldHVyIGFkaXBpc2ljaW5nIGVsaXQuIFNvbHV0YSBxdWFlIHN1bnQsIGxhYm9yaW9zYW0gbW9sZXN0aWFzIGRlbGVuaXRpIG5hbSEgRW5pbSBleGVyY2l0YXRpb25lbSBkaWN0YSBtYXhpbWUgcGVyZmVyZW5kaXMgc2l0IGFjY3VzYW11cyBhbGlxdWlkIHF1aXNxdWFtIGRlYml0aXMgZmFjaWxpcyB2ZWxpdCwgZG9sb3JlbSBsaWJlcm8sIGZ1Z2lhdC4KICAgIDwvZGl2PgoKICAgIDxmb290ZXI+CgogICAgPC9mb290ZXI+Cgo8L2JvZHk+CjwvaHRtbD4=[\/et_pb_dmb_code_snippet][et_pb_dmb_code_snippet title=”Code lesson (CSS)” code=”QGltcG9ydCB1cmwoImFuYWhpdC9hbmFoaXQuY3NzIik7Cgpib2R5IHsKICAgIGZvbnQtZmFtaWx5OiAiQU1HIEFuYWhpdCIsICJBcmlhbCIsIHNhbnMtc2VyaWY7CiAgICBmb250LXNpemU6IDE2cHg7Cn0KCmhlYWRlcnsKICAgIGJhY2tncm91bmQtY29sb3I6ICM3YzRkZmY7CiAgICBvdmVyZmxvdzogaGlkZGVuOwp9CgoubG9nbywgLnBob25lLCAuc2VhcmNoIHsKICAgIGZsb2F0OiBsZWZ0OwogICAgd2lkdGg6IDMzJTsKfQoKLnBob25lIHAgewogICAgY29sb3I6ICNmZmY7CiAgICBmb250LXNpemU6IDI1cHg7CiAgICBtYXJnaW4tdG9wOiAyMHB4Owp9Cgouc2VhcmNoIGZvcm0gewogICAgbWFyZ2luLXRvcDogMjVweDsKfQ==” admin_label=”\u041a\u043e\u0434 \u0443\u0440\u043e\u043a\u0430 ” style=”docco” linenums=”on” usetabwidth=”on” tabwidth=”4″ _builder_version=”4.4.2″ hover_enabled=”0″]QGltcG9ydCB1cmwoImFuYWhpdC9hbmFoaXQuY3NzIik7Cgpib2R5IHsKICAgIGZvbnQtZmFtaWx5OiAiQU1HIEFuYWhpdCIsICJBcmlhbCIsIHNhbnMtc2VyaWY7CiAgICBmb250LXNpemU6IDE2cHg7Cn0KCmhlYWRlcnsKICAgIGJhY2tncm91bmQtY29sb3I6ICM3YzRkZmY7CiAgICBvdmVyZmxvdzogaGlkZGVuOwp9CgoubG9nbywgLnBob25lLCAuc2VhcmNoIHsKICAgIGZsb2F0OiBsZWZ0OwogICAgd2lkdGg6IDMzJTsKfQoKLnBob25lIHAgewogICAgY29sb3I6ICNmZmY7CiAgICBmb250LXNpemU6IDI1cHg7CiAgICBtYXJnaW4tdG9wOiAyMHB4Owp9Cgouc2VhcmNoIGZvcm0gewogICAgbWFyZ2luLXRvcDogMjVweDsKfQ==[\/et_pb_dmb_code_snippet][et_pb_comments _builder_version=”4.4.2″ custom_margin=”30px||||false|false”][\/et_pb_comments][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"

In this lesson we will begin to create web site. First of all we begin to create header. Also I’ll show you how to include web fonts using google fonts and webfont.ru There are list of standard fonts: 1. Arial 2. Verdana 3. Times 4. Times New Roman 5. Georgia 6. Trebuchet MS 7. Sans […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"\u0412 \u044d\u0442\u043e\u043c \u0443\u0440\u043e\u043a\u0435 \u043c\u044b \u043d\u0430\u0447\u043d\u0435\u043c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0441\u0430\u0439\u0442-\u0432\u0438\u0437\u0438\u0442\u043a\u0443. \u041d\u0430\u0447\u043d\u0435\u043c \u043c\u044b \u0441 \u0448\u0430\u043f\u043a\u0438 \u0441\u0430\u0439\u0442\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0431\u0443\u0434\u0435\u0442 \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u0441\u0442\u0440\u0430\u043d\u0438\u0446. \u0422\u0430\u043a \u0436\u0435 \u0432 \u044d\u0442\u043e\u043c \u0443\u0440\u043e\u043a\u0435 \u044f \u043f\u043e\u043a\u0430\u0436\u0443, \u043a\u0430\u043a \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0435 \u0448\u0440\u0438\u0444\u0442\u044b \u043d\u0430 \u0441\u0430\u0439\u0442, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f google fonts<\/a> \u0438 webfont.ru<\/a>\r\n\r\nhttps:\/\/www.youtube.com\/watch?v=SRX3FFqY8vI\r\n\r\n\u0421\u043b\u0435\u0434\u0443\u0435\u0442 \u043e\u0442\u043c\u0435\u0442\u0438\u0442\u044c, \u0447\u0442\u043e \u0435\u0441\u0442\u044c \u0441\u043f\u0438\u0441\u043e\u043a \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u0448\u0440\u0438\u0444\u0442\u043e\u0432:\r\n1. Arial\r\n2. Verdana\r\n3. Times\r\n4. Times New Roman\r\n5. Georgia\r\n6. Trebuchet MS\r\n7. Sans\r\n8. Sans\r\n9. Comic Sans MS\r\n10. Courier New\r\n11. Webdings\r\n12. Garamond\r\n13. Helvetica\r\n\r\n\u0415\u0449\u0435 \u0435\u0441\u0442\u044c \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 \u0448\u0440\u0438\u0444\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u043d\u0435\u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u0432 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u041e\u0421.\r\n1. Palatino Linotype \/ Palatino\r\n2. Tahoma\r\n3. Impact\r\n4. Century Gothic\r\n5. Arial Black\r\n6. Arial Narrow\r\n7. Copperplate \/ Copperplate Gothic Light\r\n8. Gill Sans \/ Gill Sans MT\r\n\r\n\u0415\u0449\u0435 \u0432 \u044d\u0442\u043e\u043c \u0443\u0440\u043e\u043a\u0435 \u044f \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u0430\u043b \u043a\u0430\u043a \u0443\u0431\u0440\u0430\u0442\u044c \u043e\u0442\u0441\u0442\u0443\u043f\u044b \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 css \u0444\u0430\u0439\u043b, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u0434\u043b\u044f \u0442\u044d\u0433\u043e\u0432, \u043f\u0440\u0438\u0432\u043e\u0434\u044f \u0432\u0438\u0434 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430 \u0432\u0441\u0435\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 \"\u043a \u043e\u0431\u0449\u0435\u043c\u0443 \u0437\u043d\u0430\u043c\u0435\u043d\u0430\u0442\u0435\u043b\u044e\" - normalize.css<\/a>\r\n\r\n

\r\n\r\n\r\n    \r\n    Document<\/title>\r\n    <link rel=\"stylesheet\" href=\"style.css\">\r\n    <link rel=\"stylesheet\" href=\"https:\/\/necolas.github.io\/normalize.css\/3.0.2\/normalize.css\">\r\n    <!--<link href='https:\/\/fonts.googleapis.com\/css?family=Roboto&subset=latin,cyrillic-ext' rel='stylesheet' type='text\/css'>-->\r\n<\/head>\r\n<body>\r\n\r\n    <header>\r\n        <div class=\"wrapperHeader\">\r\n            <div class=\"logo\">\r\n                <img src=\"http:\/\/kamil-abzalov.com\/wp-content\/themes\/milleniumSecond\/img\/logo.png\" alt=\"\">\r\n            <\/div>\r\n            <div class=\"phone\">\r\n                <p>123-45-67<\/p>\r\n            <\/div>\r\n            <div class=\"search\">\r\n                <form>\r\n                    <input type=\"text\"\/>\r\n                    <input type=\"submit\">\r\n                <\/form>\r\n            <\/div>\r\n        <\/div>\r\n    <\/header>\r\n\r\n    <div id=\"content\">\r\n        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus facilis est nam, expedita eaque. Ipsum vero sapiente, tenetur voluptas aliquid accusantium. Molestiae distinctio ratione commodi! Vel officiis laborum temporibus nulla. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est maxime vel molestias reprehenderit. Nihil hic reprehenderit asperiores omnis assumenda voluptatibus modi saepe, tenetur necessitatibus error placeat, fugit, odio impedit. Eaque. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Soluta quae sunt, laboriosam molestias deleniti nam! Enim exercitationem dicta maxime perferendis sit accusamus aliquid quisquam debitis facilis velit, dolorem libero, fugiat.\r\n    <\/div>\r\n\r\n    <footer>\r\n\r\n    <\/footer>\r\n\r\n<\/body>\r\n<\/html>\r\n<\/code><\/pre>\r\n\r\n<pre><code>@import url(\"anahit\/anahit.css\");\r\n\r\nbody {\r\n    font-family: \"AMG Anahit\", \"Arial\", sans-serif;\r\n    font-size: 16px;\r\n}\r\n\r\nheader{\r\n    background-color: #7c4dff;\r\n    overflow: hidden;\r\n}\r\n\r\n.logo, .phone, .search {\r\n    float: left;\r\n    width: 33%;\r\n}\r\n\r\n.phone p {\r\n    color: #fff;\r\n    font-size: 25px;\r\n    margin-top: 20px;\r\n}\r\n\r\n.search form {\r\n    margin-top: 25px;\r\n}\r\n<\/code><\/pre>","_et_gb_content_width":"","footnotes":""},"categories":[257,219],"tags":[259,243],"class_list":["post-3137","post","type-post","status-publish","format-standard","hentry","category-html-css","category-tutorials","tag-css-en","tag-html-en"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Creating simple web site. Including fonts to web site - Kamil Abzalov's blog<\/title>\n<meta name=\"description\" content=\"Creating simple web site. Including fonts to web site from google fonts and webfont.ru\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Creating simple web site. Including fonts to web site - Kamil Abzalov's blog\" \/>\n<meta property=\"og:description\" content=\"Creating simple web site. Including fonts to web site from google fonts and webfont.ru\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/\" \/>\n<meta property=\"og:site_name\" content=\"\u0441\u0430\u0439\u0442 \u041a\u0430\u043c\u0438\u043b\u044f \u0410\u0431\u0437\u0430\u043b\u043e\u0432\u0430\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/kamabzalov\" \/>\n<meta property=\"article:published_time\" content=\"2017-08-06T19:25:08+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-04-08T16:51:52+00:00\" \/>\n<meta name=\"author\" content=\"Kamil' Abzalov\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:title\" content=\"Including fonts to web site\" \/>\n<meta name=\"twitter:description\" content=\"Creating simple web site. Including fonts to web site from google fonts and webfont.ru\" \/>\n<meta name=\"twitter:creator\" content=\"@kamabzalov\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kamil' Abzalov\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/videouroki\\\/html-css\\\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/videouroki\\\/html-css\\\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\\\/\"},\"author\":{\"name\":\"Kamil' Abzalov\",\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/#\\\/schema\\\/person\\\/9c53360f21b83306ba40c2231573c600\"},\"headline\":\"Creating simple web site. Including fonts to web site\",\"datePublished\":\"2017-08-06T19:25:08+00:00\",\"dateModified\":\"2020-04-08T16:51:52+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/videouroki\\\/html-css\\\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\\\/\"},\"wordCount\":1105,\"commentCount\":0,\"keywords\":[\"css\",\"html\"],\"articleSection\":[\"HTML and CSS\",\"Tutorials\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/kamil-abzalov.com\\\/videouroki\\\/html-css\\\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/videouroki\\\/html-css\\\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\\\/\",\"url\":\"https:\\\/\\\/kamil-abzalov.com\\\/videouroki\\\/html-css\\\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\\\/\",\"name\":\"Creating simple web site. Including fonts to web site - Kamil Abzalov's blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/#website\"},\"datePublished\":\"2017-08-06T19:25:08+00:00\",\"dateModified\":\"2020-04-08T16:51:52+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/#\\\/schema\\\/person\\\/9c53360f21b83306ba40c2231573c600\"},\"description\":\"Creating simple web site. Including fonts to web site from google fonts and webfont.ru\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/videouroki\\\/html-css\\\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/kamil-abzalov.com\\\/videouroki\\\/html-css\\\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/videouroki\\\/html-css\\\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\",\"item\":\"https:\\\/\\\/kamil-abzalov.com\\\/en\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Creating simple web site. Including fonts to web site\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/#website\",\"url\":\"https:\\\/\\\/kamil-abzalov.com\\\/\",\"name\":\"\u0441\u0430\u0439\u0442 \u041a\u0430\u043c\u0438\u043b\u044f \u0410\u0431\u0437\u0430\u043b\u043e\u0432\u0430\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/kamil-abzalov.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/kamil-abzalov.com\\\/#\\\/schema\\\/person\\\/9c53360f21b83306ba40c2231573c600\",\"name\":\"Kamil' Abzalov\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/3ad2daebcb3a4d03f8573b49054a003cd26a151ecc58ccfccc75b823131d1ead?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/3ad2daebcb3a4d03f8573b49054a003cd26a151ecc58ccfccc75b823131d1ead?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/3ad2daebcb3a4d03f8573b49054a003cd26a151ecc58ccfccc75b823131d1ead?s=96&d=mm&r=g\",\"caption\":\"Kamil' Abzalov\"},\"sameAs\":[\"https:\\\/\\\/kamil-abzalov.com\\\/\",\"https:\\\/\\\/www.facebook.com\\\/kamabzalov\",\"https:\\\/\\\/www.linkedin.com\\\/in\\\/kamabzalov\",\"https:\\\/\\\/x.com\\\/kamabzalov\",\"https:\\\/\\\/www.youtube.com\\\/user\\\/kamabzalov\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Creating simple web site. Including fonts to web site - Kamil Abzalov's blog","description":"Creating simple web site. Including fonts to web site from google fonts and webfont.ru","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/","og_locale":"en_US","og_type":"article","og_title":"Creating simple web site. Including fonts to web site - Kamil Abzalov's blog","og_description":"Creating simple web site. Including fonts to web site from google fonts and webfont.ru","og_url":"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/","og_site_name":"\u0441\u0430\u0439\u0442 \u041a\u0430\u043c\u0438\u043b\u044f \u0410\u0431\u0437\u0430\u043b\u043e\u0432\u0430","article_author":"https:\/\/www.facebook.com\/kamabzalov","article_published_time":"2017-08-06T19:25:08+00:00","article_modified_time":"2020-04-08T16:51:52+00:00","author":"Kamil' Abzalov","twitter_card":"summary_large_image","twitter_title":"Including fonts to web site","twitter_description":"Creating simple web site. Including fonts to web site from google fonts and webfont.ru","twitter_creator":"@kamabzalov","twitter_misc":{"Written by":"Kamil' Abzalov","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/#article","isPartOf":{"@id":"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/"},"author":{"name":"Kamil' Abzalov","@id":"https:\/\/kamil-abzalov.com\/#\/schema\/person\/9c53360f21b83306ba40c2231573c600"},"headline":"Creating simple web site. Including fonts to web site","datePublished":"2017-08-06T19:25:08+00:00","dateModified":"2020-04-08T16:51:52+00:00","mainEntityOfPage":{"@id":"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/"},"wordCount":1105,"commentCount":0,"keywords":["css","html"],"articleSection":["HTML and CSS","Tutorials"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/","url":"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/","name":"Creating simple web site. Including fonts to web site - Kamil Abzalov's blog","isPartOf":{"@id":"https:\/\/kamil-abzalov.com\/#website"},"datePublished":"2017-08-06T19:25:08+00:00","dateModified":"2020-04-08T16:51:52+00:00","author":{"@id":"https:\/\/kamil-abzalov.com\/#\/schema\/person\/9c53360f21b83306ba40c2231573c600"},"description":"Creating simple web site. Including fonts to web site from google fonts and webfont.ru","breadcrumb":{"@id":"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kamil-abzalov.com\/videouroki\/html-css\/sozdanie-sajta-vizitki-podkljuchenie-shriftov-na-sajt\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430","item":"https:\/\/kamil-abzalov.com\/en\/"},{"@type":"ListItem","position":2,"name":"Creating simple web site. Including fonts to web site"}]},{"@type":"WebSite","@id":"https:\/\/kamil-abzalov.com\/#website","url":"https:\/\/kamil-abzalov.com\/","name":"\u0441\u0430\u0439\u0442 \u041a\u0430\u043c\u0438\u043b\u044f \u0410\u0431\u0437\u0430\u043b\u043e\u0432\u0430","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kamil-abzalov.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/kamil-abzalov.com\/#\/schema\/person\/9c53360f21b83306ba40c2231573c600","name":"Kamil' Abzalov","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/3ad2daebcb3a4d03f8573b49054a003cd26a151ecc58ccfccc75b823131d1ead?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/3ad2daebcb3a4d03f8573b49054a003cd26a151ecc58ccfccc75b823131d1ead?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/3ad2daebcb3a4d03f8573b49054a003cd26a151ecc58ccfccc75b823131d1ead?s=96&d=mm&r=g","caption":"Kamil' Abzalov"},"sameAs":["https:\/\/kamil-abzalov.com\/","https:\/\/www.facebook.com\/kamabzalov","https:\/\/www.linkedin.com\/in\/kamabzalov","https:\/\/x.com\/kamabzalov","https:\/\/www.youtube.com\/user\/kamabzalov"]}]}},"_links":{"self":[{"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/posts\/3137","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/comments?post=3137"}],"version-history":[{"count":8,"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/posts\/3137\/revisions"}],"predecessor-version":[{"id":31770,"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/posts\/3137\/revisions\/31770"}],"wp:attachment":[{"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/media?parent=3137"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/categories?post=3137"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kamil-abzalov.com\/en\/wp-json\/wp\/v2\/tags?post=3137"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}