Тег <output> в HTML — вивід результату обчислень

<h3>Приклад з використанням атрибуту <code>output</code></h3>
<p>Додавання чисел:</p>
		<form oninput = "с.value = a.valueAsNumber + b.valueAsNumber">
			<input type = "number" id = "a"> +
			<input type = "number" id = "b"> =
			<mark> <output name = "с" for = "a b"> </output> </mark>
		</form>

HTML

<form oninput="total.value = (qty.valueAsNumber * price.valueAsNumber).toFixed(2)">
  <p><label>Кількість <input type="number" id="qty" value="2" min="1"></label></p>
  <p><label>Ціна, грн <input type="number" id="price" value="149.50" step="0.01"></label></p>
  <p>До сплати: <output name="total" for="qty price">299.00</output> грн</p>
  <p><button type="reset">Скинути</button> — і output повернеться до 299.00</p>
</form>

CSS

output {
  display: inline-block;
  min-width: 6ch;
  padding: .15rem .5rem;
  background: #eafbea;
  border-radius: .3rem;
  font-weight: bold;
}

input {
  width: 8rem;
}

HTML

<h3>Приклад з використанням атрибуту <code>output</code></h3>
<p>Додавання чисел:</p>
	<form oninput = "sumresult.value = parseInt(z1.value)+parseInt(z2.value)">
         <input type = "range" name = "z1" value = "0" /> +
         <input type = "number" name = "z2" value = "10" /> 
   <br /><br>
         The output is: <output name = "sumresult"></output>
      </form>

CSS

body { 
                text-align:center; 
            } 
            h1 { 
                color:green; 
            }