• <button id="eiyoe"><acronym id="eiyoe"></acronym></button>
    <em id="eiyoe"></em>

  • <rp id="eiyoe"><acronym id="eiyoe"><input id="eiyoe"></input></acronym></rp>
      查看: 426|回復: 0
      上一主題 下一主題

      css position fixed 左右雙定位的實現代碼

      80292

      主題

      0

      好友

      積分

      離線 發信

      跳轉到指定樓層
      樓主
      發表于 2021-07-25 19:58 | 只看該作者 | 倒序瀏覽

      CSS Position(定位)
      position 屬性指定了元素的定位類型。

      position 屬性的五個值:

      • static
      • relative
      • fixed
      • absolute
      • sticky

      元素可以使用的頂部,底部,左側和右側屬性定位。然而,這些屬性無法工作,除非是先設定position屬性。他們也有不同的工作方式,這取決于定位方法。

      <!DOCTYPE html>
      <html>
      	<head>
      		<meta charset="utf-8">
      		<title></title>
      		<style>
      			.box{
      				width: 1400px;
      				height: 1500px;
      				margin: 0 auto;
      			}
      			.box1{
      				border: 1px solid #000000;
      				height: 200px;
      				width: 200px;
      			    display: inline-block;
      				position: fixed;
      		
      			}
      			.box02{
      				    border: 1px solid #006400;
      				    height: 1500px;
      				    width: 800px;
      				    display: inline-block;
      				    margin: 0 20px;
      				    margin-left: 250px;
      			}
      			.box03{
      				border: 1px solid #006400;
      				height: 200px;
      				width: 200px;
      				display: inline-block;
      			    position: fixed;
      			}
      		</style>
      	</head>
      	<body>
      		<div class="box">
      			<div class="box1">123</div>
      			<div class="box02">456</div>
      			<div class="box03">789</div>
      		</div>
      	</body>
      </html>

      在這里插入圖片描述

      到此這篇關于css position fixed 左右雙定位的實現代碼的文章就介紹到這了,更多相關css position fixed定位內容請搜索腳本之家以前的文章或繼續瀏覽下面的相關文章,希望大家以后多多支持腳本之家!

      來源:http://www.jb51.net/css/773700.html