就是这个样的粗爆，手搓一个计算器：十进制到百分比转换器

       作为程序员，没有合适的工具，就得手搓一个，PC端，移动端均可适用。废话不多说，直接上代码。

HTML:

<div class="calculator"><div class="input-group"><label>十进制数:</label> <input id="decimal" step="any" type="number" placeholder="请输入十进制数"></div><button onclick="convertToPercentage()">转换为百分比</button><div class="result"><p>计算结果:</p><p>百分比: <span id="percentageOutput">0.00%</span></p></div></div>

JS:

function convertToPercentage() {const decimal = parseFloat(document.getElementById('decimal').value);if (isNaN(decimal)) {alert('请输入有效的十进制数');return;}const percentage = decimal * 100;document.getElementById('percentageOutput').textContent = percentage.toFixed(2) + '%';
}

CSS:

.calculator {width: 300px;background-color: #333;color: white;padding: 20px;border-radius: 10px;box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}label {display: block;margin-bottom: 10px;font-size: 16px;
}input, select {width: 100%!important;padding: 10px!important;margin-bottom: 20px;color: #000000; border-radius: 5px;border: 1px solid #555;font-size: 16px!important;background-color: #ffffff!important;
}button {width: 100%;padding: 10px;background-color: #007bff;color: white;border: none;border-radius: 5px;cursor: pointer;font-size: 16px;display: block;margin: 0px;margin-bottom: 20px;margin-left: 0px!important;
}button:hover {background-color: orange;
}.result {margin-top: 20px;text-align: center;
}option {background-color: #ffffff;
}p {font-size: 18px;margin-top: 5px!important;
}

线上运行，可以直接打开：十进制到百分比转换器