0
0

Выполнил урок 2.7. из Веб разработка 2020. Когда закончил, сайт отображался нормально. При следующем открытии перестали отображаться бекграунд и иконки (http://prntscr.com/ufte8g, http://prntscr.com/ufteio). Когда загружал с VS Code, выскочило сообщение на английском языке относительно style.min.css. Смысл его не понял, но кажется говорилось о каком-то несоответствии. Ничего не предпренимал, потому-что не знаю где искать ошибку.

Код style.min.css

* {
  font-family: Roboto sans-serif;
}
header {
  position: relative;
  height: 50px;
}
nav {
  position: fixed;
  width: 100%;
  height: 50px;
  background-color: #212121;
  z-index: 2;
}
.menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 16px 70px;
  margin: 0;
  list-style-type: none;
}
.menu_link {
  color: #ffffff;
  font-size: 15px;
  font-weight: 300;
}
.menu_item {
  border-right: 2px dotted black;
  padding-right: 28px;
}
.subheader {
  position: absolute;
  top: 50px;
  width: 100%;
  height: 84px;
  background-color: rgba(0, 0, 0, 0.6);
}
.subheader_logo {
  display: block;
  max-width: 100%;
  margin-top: 16px;
}
.subheader_official {
  margin-top: 6px;
  opacity: 0.5;
  color: #ffffff;
  font-size: 13px;
  font-weight: 400;
}
.subheader_call {
  margin-top: 19px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 300;
  text-align: right;
}
.subheader_phone {
  display: block;
  margin-top: 8px;
  text-align: right;
  color: #ffffff;
  font-size: 22px;
  font-weight: 400;
  text-transform: uppercase;
  line-height: 12px;
}
.subheader .subheader_btn {
  margin-top: 19px;
  width: 172px;
  height: 46px;
  -webkit-box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.12);
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.12);
  border: none;
  border-radius: 5px;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#1eacc7),
    to(#4ce2ff)
  );
  background-image: linear-gradient(to top, #1eacc7 0%, #4ce2ff 100%);
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.21);
  color: #ffffff;
  font-size: 14px;
  font-weight: 400;
  text-transform: uppercase;
}
.promo {
  min-height: 800px;
  background: url(../img/main_bg.png) center center/cover no-repeat;
  padding: 150px 0 135px 0;
}
.promo_header {
  color: #ffffff;
  font-size: 60px;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 60px;
  margin: 0;
  text-align: center;
}
.promo_subheader {
  color: #ffffff;
  font-weight: 700;
  font-size: 36px;
  line-height: 36px;
  margin: 0;
  margin-top: 22px;
  text-align: center;
}
.promo_descr {
  color: #ffffff;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
  text-align: center;
  margin-top: 23px;
}
.promo_btn {
  display: block;
  margin: 118px auto 0 auto;
  width: 259px;
  height: 63px;
  -webkit-box-shadow: inset 0 -4px 0 rgba(0, 0, 0, 0.12);
  box-shadow: inset 0 -4px 0 rgba(0, 0, 0, 0.12);
  border: none;
  border-radius: 5px;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#1eacc7),
    to(#4ce2ff)
  );
  background-image: linear-gradient(to top, #1eacc7 0%, #4ce2ff 100%);
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.21);
  color: #ffffff;
  font-size: 18px;
  font-weight: 400;
  text-transform: uppercase;
}
.advant {
  padding: 71px 0 68px 0;
}
.label {
  margin: 0 auto;
  padding: 5px 11px 8px;
  width: 112px;
  height: 24px;
  background-color: #000000;
  color: #ffffff;
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  text-align: center;
}
.title {
  text-align: center;
  margin-top: 38px;
  margin-bottom: 0;
  color: #222222;
  font-size: 38px;
  font-weight: 700;
  text-transform: uppercase;
}
.subtitle {
  color: #222222;
  font-size: 17px;
  font-weight: 400;
  margin-top: 19px;
  text-align: center;
}
.advant .advant_block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 35px;
}
.advant_round {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-right: 26px;
  width: 113px;
  height: 113px;
  border-radius: 100%;
  background-color: #1eacc7;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.advant_descr {
  width: 341px;
}
.advant_descr .advant_subtitle {
  color: #1eacc7;
  font-size: 17px;
  font-weight: 400;
  line-height: 21px;
}
.advant_descr .advant_text {
  color: #202020;
  font-size: 15px;
  font-weight: 300;
  line-height: 21px;
}
.mobile {
  min-height: 864px;
  padding: 48px 0 80px 0;
  background: url("../img/bg/mobile_app.png") center center/cover no-repeat;
}
.mobile_item {
  width: 320px;
  height: 280px;
  margin: 0 auto;
}
.mobile_item_1 {
  background: url("../img/mobile_screen_1.png") center center/cover no-repeat;
}
.mobile_item_2 {
  background: url("../img/mobile_screen_2.png") center center/cover no-repeat;
}
.mobile_item_3 {
  background: url("../img/mobile_screen_3.png") center center/cover no-repeat;
}
.mobile_item_4 {
  background: url("../img/mobile_screen_4.png") center center/cover no-repeat;
}
.mobile_item_5 {
  background: url("../img/mobile_screen_5.png") center center/cover no-repeat;
}
.mobile_item_6 {
  background: url("../img/mobile_screen_6.png") center center/cover no-repeat;
}
/*# sourceMappingURL=style.min.css.map */


Serik Seidakhanov
4 years ago






Нашел где проблема. В обоих случаях был нарушен путь директория. В первом случае к фоновой картинке, во втором случае к иконкам. Предполагаю при сохранении и закрытии редактора это произошло. 

Serik Seidakhanov
4 years ago

Один ответ