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

CSSによる固定ポジショニング

固定位置を使用すると、スクロールに関係なく、要素の位置をページ上の特定の場所に固定できます。指定された座標は、ブラウザウィンドウを基準にしています。

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

  • 左に移動-左には負の値を使用します 。
  • 右に移動-左には正の値を使用します 。
  • 上に移動-topに負の値を使用します 。
  • 下に移動-topには正の値を使用します 。
例 次のコードを実行して、固定ポジショニングを実装してみてください

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

  1. CSSを使用して固定/スティッキーフッターを作成するにはどうすればよいですか？

    CSSで固定フッターを作成するためのコードは次のとおりです- 例 <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style>    body{       font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

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

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