CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

CSSによる絶対測位


位置がの要素: 絶対 画面の左上隅を基準にして指定された座標に配置されます。

2つの値を使用できますtop そして 位置と一緒に HTML要素をHTMLドキュメント内の任意の場所に移動するためのプロパティ。

  • 左に移動-左に負の値を使用します。
  • 右に移動-左に正の値を使用します。
  • 上に移動-topに負の値を使用します。
  • 下に移動-topに正の値を使用します。

次のコードを実行して、絶対測位を実装してみてください-

<html>
   <head>
   </head>
   <body>
      <div style = "position:absolute; left:80px; top:20px; background-color:yellow;">
         This div has absolute positioning.
      </div>
   </body>
</html>

  1. CSSを使用した絶対測位

    CSSでの要素の配置を絶対値として定義できます。これにより、最初に配置された(静的を除く)親を基準にして要素がレンダリングされます。ポジショニング方法が絶対値である要素は、CSSポジショニングプロパティ(左、右、上、下)によって配置されます。 例 CSS絶対測位方法の例を見てみましょう- <!DOCTYPE html> <html> <head> <style> p {    margin: 0;    position: absolute;    top: 50%;   &

  2. CSSを使用して円形パス内の要素を移動する方法は?

    CSSアニメーションは、組み合わせ、回転、変換することで、さまざまな方法で要素を変換するのに役立ちます。 次の例は、円形パスで要素を移動する方法を示しています。 例 <!DOCTYPE html> <html> <head> <style> div {    margin: 8%;    width: 35px;    height: 35px;    border-radius: 5px;    background: red;