Unterschied zwischen style.width und offsetwidth in HTML?

Lesezeit: 2 Minuten

Unterschied zwischen stylewidth und offsetwidth in HTML
yeeen

das merke ich offsetwidth ist eine etwas größere Zahl. Ähnlich für style.height und offsetheight.

1641733861 600 Unterschied zwischen stylewidth und offsetwidth in HTML
sol0mka

offsetWidth gibt die Breite des berechneten Elements zurück, während el.style.width gibt nur die in . definierte Breiteneigenschaft zurück element.style durch javascript und spiegelt nicht die Abmessungen des realen Elements wider.

Dies bedeutet, dass Sie versuchen, eine Breite des Elements zu erhalten, indem Sie auf el.style, du wirst wahrscheinlich nichts bekommen (sample), auch wenn die Breite in Ihrem CSS definiert wurde. Sie erhalten die Nummer nur, wenn sie definiert wurde in el.style durch javascript.

Außerdem, offsetWidth gibt Ihnen die tatsächliche Breite Ihres Elements, einschließlich padding und border wenn du benutzt content-box css box model was ist der Standardwert für box-sizing. So kannst du darüber nachdenken, wie du es eingestellt hast width des Inhalts des Elements und padding/border weiter so (sample).

Wenn Sie verwenden Border-Box css box model, legen Sie die Gesamtbreite des Elements fest, einschließlich padding und border verkleinern Sie den Inhaltsbereich (sample). Also in diesem Fall offsetWidth und el.style.width würde genau die gleichen Zahlen zurückgeben (wenn el.style.width wurde zuvor eingestellt von javascript).

  • In dieser Antwort sind einige Juwelen! Lies es sorgfältig!

    – Govind Rai

    25. Dezember ’16 um 22:41

Unterschied zwischen stylewidth und offsetwidth in HTML
Tim S.

Normalerweise ist offsetWidth eines Elements ein Maß, das die Elementränder, das horizontale Padding des Elements, die vertikale Bildlaufleiste des Elements (sofern vorhanden, falls gerendert) und die CSS-Breite des Elements umfasst.

Quelle: https://developer.mozilla.org/en/DOM/element.offsetWidth


Es ist also die Breite Ihres Elements einschließlich Rahmen und Auffüllung. Das gleiche für die Höhe.

  • Es enthält nicht den Rand, daher ist diese Antwort falsch /

    – Samih

    21. Februar ’14 um 11:50

offsetWidth ist ein Maß in Pixeln der CSS-Breite des Elements, einschließlich aller Rahmen, Auffüllungen und vertikalen Bildlaufleisten.

clientWidth ist die innere Breite (d. h. der Raum innerhalb eines Elements einschließlich Auffüllung, aber ohne Rahmen und Bildlaufleisten)

mit nur das CSS mit definiert zurückgeben

.

212540cookie-checkUnterschied zwischen style.width und offsetwidth in HTML?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy