要在不影响填充的情况下增加输入字体大小，可以使用CSS中的transform属性来实现。以下是一个示例代码：

HTML:

CSS:

.container {
  position: relative;
}

.input-field {
  font-size: 16px; /* 初始字体大小 */
  padding: 10px; /* 输入框填充 */
  width: 200px; /* 输入框宽度 */
  border: 1px solid #ccc; /* 输入框边框 */
}

.input-field.increase-font {
  transform: scale(1.2); /* 增加字体大小 */
  transform-origin: top left; /* 设置缩放原点为左上角 */
  width: 166.67px; /* 调整宽度，使得放大后的字体不会超过输入框 */
}

JavaScript:

const inputField = document.querySelector('.input-field');

inputField.addEventListener('focus', () => {
  inputField.classList.add('increase-font');
});

inputField.addEventListener('blur', () => {
  inputField.classList.remove('increase-font');
});

这段代码首先给输入框设置了初始的字体大小和填充。然后，通过添加和移除increase-font类来改变输入框的样式。当输入框获得焦点时，increase-font类被添加，输入框的字体大小会增加。当输入框失去焦点时，increase-font类被移除，输入框的字体大小会恢复初始大小。同时，为了确保放大后的字体不会超出输入框，可以通过调整输入框的宽度来适应新的字体大小。