Введите вес и рост
* Индекс массы тела является ориентировочным показателем
и не заменяет консультацию врача.
.bmi-calculator {
width: 100%;
font-family: 'Poppins', sans-serif;
color: #353535;
}
/* Заголовок */
.bmi-header {
text-align: center;
margin-bottom: 45px;
}
.bmi-header h2 {
font-size: 34px;
font-weight: 700;
line-height: 1.2;
margin: 0 0 12px;
color: #353535;
}
.bmi-line {
display: block;
width: 45px;
height: 8px;
border-radius: 20px;
background: #39ca8c;
margin: 0 auto 10px;
}
.bmi-header p {
font-size: 18px;
line-height: 1.5;
font-weight: 300;
margin: 0;
}
/* Поля ввода */
.bmi-fields {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-bottom: 40px;
}
.bmi-field label,
.bmi-result label {
display: block;
font-size: 21px;
margin-bottom: 8px;
font-weight: 400;
color: #353535;
}
.bmi-field input {
width: 100%;
height: 58px;
padding: 10px 15px;
border: 1px solid #eeeeee;
border-radius: 5px;
background: #fff;
font-family: inherit;
font-size: 18px;
color: #353535;
outline: none;
box-sizing: border-box;
transition: border-color .2s;
}
.bmi-field input:focus {
border-color: #39ca8c;
}
/* Результат */
.bmi-value {
min-height: 65px;
border: 2px solid #39ca8c;
border-radius: 4px;
background: #f1f1f1;
padding: 12px 15px;
box-sizing: border-box;
display: flex;
align-items: center;
font-size: 21px;
font-weight: 600;
color: #353535;
}
.bmi-description {
margin-top: 12px;
font-size: 16px;
line-height: 1.5;
}
.bmi-description:empty {
display: none;
}
/* Примечание */
.bmi-disclaimer {
margin-top: 20px;
font-size: 12px;
color: #777;
line-height: 1.5;
}
/* Мобильная версия */
@media (max-width: 767px) {
.bmi-header {
margin-bottom: 30px;
}
.bmi-header h2 {
font-size: 25px;
}
.bmi-header p {
font-size: 15px;
}
.bmi-fields {
grid-template-columns: 1fr;
gap: 18px;
margin-bottom: 30px;
}
.bmi-field label,
.bmi-result label {
font-size: 18px;
}
.bmi-field input {
height: 50px;
font-size: 16px;
}
.bmi-value {
min-height: 55px;
font-size: 18px;
}
.bmi-description {
font-size: 14px;
}
}
(function () {
const weight = document.getElementById('bmi-weight');
const height = document.getElementById('bmi-height');
const result = document.getElementById('bmi-value');
const description = document.getElementById('bmi-description');
if (!weight || !height || !result || !description) return;
function calculateBMI() {
const w = parseFloat(weight.value);
const h = parseFloat(height.value);
if (!weight.value || !height.value) {
result.textContent = 'Введите вес и рост';
description.textContent = '';
return;
}
if (
!Number.isFinite(w) ||
!Number.isFinite(h) ||
w 500 ||
h 250
) {
result.textContent = 'Проверьте введенные данные';
description.textContent = '';
return;
}
const bmi = w / Math.pow(h / 100, 2);
let category = '';
let advice = '';
if (bmi < 18.5) {
category = 'Недостаточная масса тела';
advice = 'Рекомендуется консультация специалиста для оценки питания и состояния здоровья.';
} else if (bmi < 25) {
category = 'Нормальная масса тела';
advice = 'Ваш показатель находится в пределах нормального диапазона ИМТ.';
} else if (bmi < 30) {
category = 'Избыточная масса тела';
advice = 'Рекомендуется оценить факторы риска и обсудить коррекцию веса со специалистом.';
} else if (bmi < 35) {
category = 'Ожирение I степени';
advice = 'Рекомендуется консультация врача для оценки состояния здоровья и выбора тактики лечения.';
} else if (bmi < 40) {
category = 'Ожирение II степени';
advice = 'Рекомендуется обратиться к специалисту для комплексной оценки и подбора лечения.';
} else {
category = 'Ожирение III степени';
advice = 'Рекомендуется обратиться к врачу для комплексной оценки и обсуждения возможных методов лечения.';
}
result.textContent = bmi.toFixed(1);
description.innerHTML =
'
' + category + '' + advice;
}
weight.addEventListener('input', calculateBMI);
height.addEventListener('input', calculateBMI);
})();
