A presentation at Tech Talk @ Tagesspiegel by Gunnar Bittersmann
Back to the roots
BEISPIEL: BILDERGALERIE
a·b=A b a a/b=r a=r·b r·b·b=A b² = A / r b = √A / r a = r · √A / r a = √A · r
Heron-verfAHren (babyLoniscHEs wuRzElzieHen) Babylonian method (Heron’s method) a=2 x0 ≈ √a > 0 xn+1 = (xn + a / xn) / 2 x0 = 1 x1 = (1 + 2 / 1) / 2 = 1.5 x2 = (1.5 + 2 / 1.5) / 2 = 1.41666667 lim xn = √a n ∞ x3 = (1.41666667 + 2 / 1.41666667) / 2 = 1.41421568… √2 = 1.41421356…
Heron-Verfahren (babylonisches Wurzelziehen) a=2 x0 ≈ √a > 0 xn+1 = (xn + a / xn) / 2 x0 = 1 x1 = (1 + 2 / 1) / 2 = 1.5 x2 = (1.5 + 2 / 1.5) / 2 = 1.41666667 lim xn = √a n→∞ x3 = (1.41666667 + 2 / 1.41666667) / 2 = 1.41421568… √2 = 1.41421356…
Heron-Verfahren (babylonisches Wurzelziehen) x0 ≈ √a > 0 @function sqrt($a, $iterations: 10) { $x: 1; @for $i from 1 through $iterations { $x: ($x + $a / $x) / 2; } xn+1 = (xn + a / xn) / 2 lim xn = √a n→∞ } @return $x;
Heron-Verfahren (babylonisches Wurzelziehen) —area: 0.4; —a: calc(var(!—area) * var(—aspect-ratio)); —x0: 1; —x1: calc((var(!—x0) + var(!—a) / var(!—x0)) / 2); —x2: calc((var(!—x1) + var(!—a) / var(!—x1)) / 2); —x3: calc((var(!—x2) + var(!—a) / var(!—x2)) / 2); width: calc(var(!—x3) * 100%);
BeispiEl: bildeRgalErie
<img src=”https:!//bittersmann.de/images/65.1057/580.jpg” style=”!—aspect-ratio: calc(4/3)” alt=”“!/> Das sind keine Inline-Styles. <div class=”container”> <div class=”row”> <div class=”col-12 col-md-8 col-lg-6”> Aber das sind Inline-Styles. 💩
WinkelFunktIoNen (Taylor-reIhen)
Back e th o t Future
Wurzeln ziehen in CSS
The following resources were mentioned during the presentation or are useful additional information.
Vortrag bei Upfront, Januar 2014
Artikel im Webkrauts-Adventskalender 2015
Vortrag auf dem Webkongress Erlangen, September 2018
